How do I call functions and get the return values from a popup?
I've been trying to put together a simple proof-of-concept for an idea I had to create an extension that could call some functions and get data from a content script running on a page.
I can't seem to figure out how to get the communication between the popup and the content script.
I keep coming across information that says to either use the underlying
chrome.runtime in the content script or use plasmo's messaging, but whenever I try to do any kind of messaging in the content script, I get an error saying that chrome.runtime effectively doesn't exist (trying to access a property of a non-object)....Can a Browser Extension look like Apple's Dynamic Island?
I've never built a browser extension, but I had an inkling of a UI idea to build something akin to https://emilkowal.ski/ui/dynamic-island that could show up in the user's top right corner and morph around.
This is probably a stupid question, but in the spirit of the Post Guidelines of "Ask anything here, and we mean anything!", is this possible?...
How do you debug a problem when yarn dev just exits?
I've got a bug where when I run yarn dev, it exists without printing anything useful:
(base) james@MacBook-Pro ~/workspace/ts/packages/cardstacker (ts)$ yarn dev
🟣 Plasmo v0.86.1
🔴 The Browser Extension Framework...
Send data from content script or popup to main content script.
I want to manipulate some dom items on the main world, how do I send a message from my popup or my overlay content script to the main world using the messaging api?
Loading a content script on a specific tab
Howdy folks,
I'm wanting to explicitly load a content script on a specific tab, so it doesn't interfere with other tabs. I have this working outside of Plasmo using the following:
await chrome.scripting.executeScript({
target: { tabId: tabID },...
Help: chrome.scripting.executeScript executes only once
Hey guys, I need help with the below code. I have created a popup with a button that calls the below mentioned handleClick function which executes the function foo from foo.ts
The code works but it is executed only for the first button click. I see "bar" logged in the console window but nothing happens on further clicks.
popup.tsx:
import foo from "url:~scripts/foo.ts"...
Web Worker
hey im working with a web worker and it seems to be huge in dev but much smaller in the prod build. Is there a sprint I can make/run to bundle the worker so i can use that version in dev also as it takes a long time for it to mount in dev?
Integrating Web Authentication with Plasmo Extension
I'm new to Plasmo and currently working on creating a Vue extension. My web application utilizes Clerk authentication, and I want to handle extension authentication based on the web session. Essentially, I aim to pass the JWT token or user data from the web session to the extension. This way, when calling any endpoint (such as implementing a comments functionality in the extension), I can use the token in the endpoint header to process the next flow from the backend/database.
I've cloned the PlasmoHQ/with-vue repository and set up my sidebar and other UI components in the extension. However, I'm uncertain about the best approach to achieve seamless authentication between the web and the extension. Should I integrate Clerk into the extension project as well? Or are there alternative methods available to obtain the session from the web?
I'd appreciate any insights or suggestions on the best practices and methodologies to handle this scenario efficiently....
Using Stripe and setup an API inside the extension
Hello !
I am able to make queries to stripe using what was explained on the website :
https://docs.plasmo.com/quickstarts/with-stripe
...
Hey all. Anyone know how to inject styles as a .css file to some webpage?
im rewriting some extension since we are going to mv3, also i decieded to use Plasmo framework for this, all cool i like it so far but im not sure where to put my files so they get bundled in final code. I have this .css file that im trying to inject when website loads.
const insertCSSRule = async (request, sender) => {
return chrome.scripting.insertCSS({...
remount csui on url change
i have built an extension using plasmo which injects some ui into the dom using getRootContainer
the component where i am injecting my csui unmounts when the url changes, hence i want to make it remount on each url change
basically my getRootContainer and render functions must re-run on each url change...
Is there something special you need to do to get a side panel to refresh on changes?
Is there something special you need to do to get a side panel to refresh on changes? If I load and reload the side panel the changes are there, but that's kind of painful.
Using microphone in sidepanel
Hello, I am using Plasmo to build our extension. I was able to record microphone using a content script. I am now trying to move the recording logic to a side panel. When I try to get user permissions for the microphone inside of the sidepanel, I simply get an error saying permissions dismissed. Curious if there are any pointers on how to navigate the issue.
run content script after click on element
I want to run certain content scripts after the user clicks on a an element. I read the documentation and searched through discord but could not find a working example. It would be wonderful if someone could provide a minimal working code
Tailwind stops hot reloading
When I change styles in the project created with the tailwind template:
pnpm create plasmo --with-tailwindcss
It usually hot reloads the first change, then stops the hot reloading. I have to pnpm dev again for changes to take effect (sometimes I have to do it twice).
Is that the way it works? Should I do something extra?...with-firebase example giving chrome web store violation.
Hey everyone, firstly huge thanks to plasmo trying to making developing web extensions more bearable.
I'm building an extension and having trouble getting the firebase/auth example to pass review.
The reason is this violation: ...
How to setup google analytics with plasmo react chrome extension in manifest v3
and not have it be rejected by the CWS because of remote code?
Which setup between those 2 examples I see in plasmo examples is the easiest and passes the CWS review without hiccups?: https://github.com/PlasmoHQ/examples/tree/main/with-google-analytics
or https://github.com/PlasmoHQ/examples/tree/main/with-google-analytics-measurement
...
Is there a way to block a browser extension that uses Plasmo in my React app?
Is there a way to block a browser extension that uses Plasmo in my React app?
Service workers
So I have this sevice worker background.ts, but I can't seen to get it working. All I'm trying to do is to get it to display the content.tsx when I click but I get the error: Failed to execute script: Error Could not load file: 'content.tsx'.
I've been iat it for like a day or two but I can't seem to figure it out.
Thanks in advance...
