🧩 Plasmo Developers

Join the 🧩 Plasmo Developers server to ask questions!

Join Server

🧩 Plasmo Developers

Join the community to ask questions about 🧩 Plasmo Developers and get answers from other members.

Join Server

Community questions

Channels

Nnotdevkey

9/11/2023

How do I access the current website URL from Plasmo popup?

Hey all, I'm trying to access the active tab URL from Plasmo popup. I'm already using storage and I need to store the url to have the extension disabled for the current website.
How would I get the website URL using Plasmo?

Ffsargent

9/8/2023

Plasmo-itero github extension is harassing my other developers

Aadmildo

9/8/2023

Embedded component won’t load custom font

I’m having trouble loading fonts. usually my embedded component will pickup the font from the body. How to solve it? #👾extension

Iinsanezulol

9/6/2023

How should I access the <html> tag of a popup page?

In context of a popup page, plasmo creates it's shadowcontainer in the <body> and not <html>
What would be the proper way to have plasmo mounted earlier - at the <html>?

Context: I've wrapped the popup page with radix's <Theme> as the root element, but this Theme isn't modyfing <html>. I think it doesn't have access to the root elements, because of being it resides in shadow dom...

Aab7zz

9/5/2023

How do I message from background to my content script?

background.tsx
```
chrome.webNavigation.onCompleted.addListener(async(details) => {
if(details.frameType == "outermost_frame"){
console.info("The user has loaded my favorite website!");
console.log(details)
const tabId = details.tabId
chrome.tabs.sendMessage(tabId, {message: "Message from background script"}, function (response) {
if (chrome.runtime.lastError) {
console.error(chrome.runtime.lastError);
} else {...

Nnotdevkey

8/30/2023

How do I make a CSUI container fill the anchor's width and height?

Working on my first browser extension and ran into this issue - I want to have the CSUI container fill anchor's width and height, so I can then use much simpler CSS to position the contents of the CSUI container wherever I want across the anchor element.
In my case, the anchor element is a simple textarea(I don't need to handle the case where the textarea gets resized).

Iillmagination

8/10/2023

Opening content script only if an element is present on the page?

I want to show my extension in a sidebar only if a certain value is present in the html of the page. Im looking to show the extension content sidebar only if the json+ld schema matches @article.

I have a scraper function that returns content if it exists (which I already have working perfectly) but lets just pretend for this question that it simply returns a boolean.

for example could this:
export const config: PlasmoCSConfig = {
matches: ["https://www.medium.com/*"],
// could be 10000000 m...

Jjfl913

8/10/2023

how to import/use external component libraries? and how to register components?

Hello, I would like to know how to import a library that will be used throughout the project (options / popup / content / CSUI...)
example: https://vuetifyjs.com/en/getting-started/installation/

And another doubt would be how do I import previously created components (.vue), mainly within the CSUI.

Ii.am.a.dev

8/9/2023

which is a good/scalable folder structure for a big extension?

Hi, If I want to create an extension that has several content scripts that are very long (has many lines of code) and some content scripts share some functions or classes, the same for background.ts, how should I organize my folder structure to make it scalable and easy to work with?

AAveri

8/8/2023

HMR for other chromium browsers

Is it possible to run a development server for opera, firefox, brave, edge, etc? I tried chaining run commands by specifying a dev target and haven't had any luck.

plasmo dev --target=<some-chromium-target>-dev

From what I can tell it's this addition to the manifest that achieves this dev server behavior:

{
            "matches": [
                "<all_urls>"
            ],
            "resources": [
                "__plasmo_hmr_proxy__"
            ]
        }

Is there maybe a...

Ii.am.a.dev

8/8/2023

Is there an extension repository that shows how the testing should be done?

Is there an extension repository that shows how the testing should be done? I want to see how the background and content scripts, popup, options, etc tests should be done.

Thank you

Ii.am.a.dev

8/6/2023

How can I put breakpoints in vs code to debug? Or if you can't, what is the correct way to debug?

Hello, how can I put breakpoints in vs code to debug? Or if you can't, what is the correct way to debug?

Ii.am.a.dev

8/5/2023

How to access the methods or variables of another third-party extension

hello, is there any way to access the methods or variables of another third-party extension (I suppose these are declared in its content script)?

I want to modify the behavior of a third party extension and it would be easier for me to access its variables or methods, and make small changes to it, or call methods from my extension,than scraping the HTML it adds to the web, or doing everything from scratch

Thanks

AAveri

8/3/2023

Build time slowed by switching to plasmo with src

Build time with src: ~8854ms
Build time without src: ~1656ms

Is there a build time improvement by not using plasmo with src as shown here: https://github.com/PlasmoHQ/examples/tree/main/with-src ? I recently migrated my file structure to use src and builds are about 5x slower. Any guidance would be great thank you!

Jjerryjfwang

8/1/2023

Importing Material Symbols to Content UI

How can I import Material Symbols to a content ui script? Tried to follow the custom font guide in the documentation but didn't have any success

@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");

Hhs285

7/28/2023

GmailJS + Plasmo

Anyone tried integrating GmailJS with Plasmo? Been using InboxSDK but I need to inject custom react components as an overlay when a user clicks an attachment. thought plasmo would be a good fit, but need gmailjs's DOM action observers.

Y_yvens

7/23/2023

Using context between sidepanel tabs

Is it possible to use a context with a firebase hook to handle authentication between multiple sidepanel tabs ?
Because I'd like to be able to navigate between multiple sidepanels for differents features in my extensions.

Iitssina

7/23/2023

Freezing and crashing without reason

import type {
PlasmoCSConfig,
PlasmoCSUIJSXContainer,
PlasmoCSUIProps,
PlasmoRender
} from 'plasmo';
import { type FC } from 'react';
import { createRoot } from 'react-dom/client';

import cssText from 'data-text:../style.css';
import { App } from '~youtube-video-sidebar/components';

// Specific Url Where Extension Injects
export const config: PlasmoCSConfig = {
matches: [
'https://www.youtube.com/',
'https://www.youtube.com/watch*',
'https://www.youtube.com/@*'
]
};

ex...

Jj0ner

7/21/2023

Modifying HttpOnly cookies

There is a specific cookie that I am trying to extend the expiration date of, but I can't figure out how to modify it. At first, I tried modifying it with a content.ts file that edits the document.cookies, but that doesn't include httpOnly cookies. I then made a BSGW and tried to use the webReqeuest API to listen to the onHeadersReceived event, but that also doesn't include the set-cookie headers. Does anyone have any ideas on how to go about doing this?

Bbatu.xd

7/16/2023

Local Storage Item does not show up in service worker dev tools ?

I am saving simple key value string (id: "123") in my background script which I'm able to read it (and can console) every time but it doesn't appear on service workers Application/Local Storage I'm not sure if it's expected behaviour or not. I have checked host websites Local storage as well it doesn't show up there as well. Interesting part is that plasmo can read it magically from somewhere