🧩 Plasmo Developers

PD

🧩 Plasmo Developers

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

Join

👾extension

👟framework

🔰newbie

🦉pallas

Do I have to publish a .zip manually to get the extension id?

When constructing SUBMIT_KEYS for google chrome extension store in github, I need the extension id.

Issue with using Radix Components with extension and framework

Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might have mismatching versions of React and the renderer (such as React DOM) 2. You might be breaking the Rules of Hooks 3. You might have more than one copy of React in the same app See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.
Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might have mismatching versions of React and the renderer (such as React DOM) 2. You might be breaking the Rules of Hooks 3. You might have more than one copy of React in the same app See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.
When importing and using Radix Components -- https://github.com/radix-ui/primitives -- I run into this error. What could be causing this. They are react components which I believe should be compatible with the framework?...

How to inject React component on page?

Hi I want to render an icon next to a div on the webpage and when that icon is clicked I want to render a React component on the top right of the page. I've found docs on how to inject a React component on the page but I'm not sure how to render it based on clicking another component. Thanks!

local storage dev tools plasmo

Hi all, I am trying to locate the storage api data. I am aware the data is stored in chrome.storage and I tried going to the devtools to get the data. However, I am not able to get the data set in chrome.storage why?. In the extension console I have tried getting it with: await chrome.storage.local.get(console.log); but I cannot find it there. I am storing the data by just setting a key like storage.set('123','value'). ...

Extension rejected by Google due to RHC violation in Firebase Auth

We have been building an extension which uses Firebase ecosystem. Recently we tried submitting the extension to Google but we got a rejection due to Remotely Hosted Code. Details are as follow: ``` Hi there, ...
No description

Publishing to TestFlight through BPP

Hey folks! I have an extension published to Chrome and Safari (through TestFlight). I was able to get Chrome publishing automated through Github Actions no problem using https://github.com/PlasmoHQ/bpp, but now I'm trying to do the same for Safari and I'm lost. I found https://github.com/PlasmoHQ/safari-webstore-api and tried configuring my BPP_KEYS based on it, but I'm getting a "No supported browser found" error. Is the safari-webstore-api package supported through BPP? Or would I just need to call it directly with the Node API? Or maybe I'd be better off using fastlane directly instead?...

How can i solve this?

Hi everybody. I am new programming in this framework and basically in React. I want to make an extension that in first instance returns me the text that I select with the mouse and shows it on the screen but as attached in the screenshot it doesn't work correctly. I copy the repository because I really don't know what I have wrong, could someone know how to solve it? Repository:https://github.com/pablo2899/Plasmo-framework Thank you very much in advance...
No description

How to debug in vscode?

I'd like to try debugging my project in vscode, but I didn't find a tutorial in the official documentation Anyone knows?...

plasmo dev is failing

here is the verbose output ``` (...) 🟡 4 | @plasmohq/optimizer-es: tabs/import-wallet-with-socials.a896c681.js tabs/import-wallet-with-socials.[hash].js /Users/dp/work/extension...

command bar modal w. CSUI

anyone successfully implemented a command bar on website that can be called by cmd-k using plasmo csui? I've installed the following pacakges by none are showing the correct CSS on load or working with the native keybord shortcuts in a content.tsx file https://cmdk.paco.me/ https://github.com/timc1/kbar...
No description

Can't access other elements outside the plasmo-csui shadow root

I'm trying to get the unique url of a tweet container when i click on the button I'm rendering. I have already specified where i want my button to be attached in the DOM. Ideally, i treid listening to the currentTarget of the click event and try to get the closest element with the attibut I have set. But it always return null. I've also tried storing the lins in localStorage. But it seems as though my approach was still flawed. This is an excerpt of what my CSUI code looks like. ...

ReferenceError: _messaging is not defined while using sendToBackground()

I am getting this weird error while trying to use the plasmo messaging package from my content script to send a message to one of the listeners (aiRequest) in my background worker Here is the code that the error is happening at: ``` const aiResponse = await sendToBackground({...

Bug : EAGAIN when use `plasmo package`

EAGAIN when using plasmo package ``` % yarn package --verbose yarn run v1.22.22...

How can I send a message from BGSW to content script and back?

The messaging documentation hardly touches on this issue, the only thing I managed to find is that I need to use ports to send messages, however, the example shown in the ports part only indicates how to transfer a message from BGSW to a popup page. This is an incredibly frustrating experience. Basically at the last stage of extension development, a problem arises for which there is practically no material and answers. My task When the user clicks on one of the actions in the context menu, image processing begins, after processing it is necessary to save it to a file or copy it to the clipboard. The image is processed in the background.ts, I want to send a request to copy the image to the content script because I need access to the DOM....
No description

Proxy authentication and API calls afterward

Hello, guys. I'm starting to give up. I'm developing proxy extension and proxying works okay. But if I make calls from inside of popup context of extension it always brig me 407 proxy authentication error. If I dont do any calls and browse the internet with those proxies, everything is fine. But it is crucial for me to fetch latest users' IP address. The listener is added after connecting to proxies synchronously and everything happens in Popup context, not background. Im using redux with redux-persist from Plasmo. This is the proxying part:...

How to mock storage

Hey guys, im fairly new with plasmo. currently writing e2e tests with playwright. How can i properly mock a call to "storage.get" or atleast prefill the value? first idea was to just manually set it like that in the context of the browser: ```...

Supabase url and anon key exposed

I am a newbie exploring Plasmo for supabase authentication. The public url and anon keys are added in the .env file. On building the file, I find the supabase url and anon keys are exposed in popup.js, which can be traced in Devtool sources. The bad actors may use the url and anonkey to exploit the auth.
What are the best ways to deal with supabase auth without exposing the url and key? Am I missing something?...

Can't figure out how to navigate from my extention to my auth page

I'm trying to test a popup extension I made that has a button that is supposed to navigate to http://localhost:3000 when clicked: ``` <script> import { fade } from 'svelte/transition';...

How can I open the side panel programmatically?

I am interested in opening the side panel programmatically by messaging the background script from the content script. However, I am not seeing any documentation on how to do that through Plasmo. I see the Chrome API has chrome.sidePanel.open({ windowId: tab.windowId }); (https://developer.chrome.com/docs/extensions/reference/api/sidePanel#user-interaction) however, this doesn't work which I am guessing because Plasmo handles the extension. Any help is appreciated! :)...

Quick screen change

Here is a simple code that i have developed. I was wandering how i can avoid the quick screen change. There is a login button that displays before the email is displayed. How can i avoid this ? (I did not find a solution within the documentation) ``` import { useState, useEffect } from "react"; import { supabase } from "~core/supabase"; // Ensure you import Supabase correctly...