🧩 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

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...

Permission Denied Error on Firefox mv2

I am running a content script which has an async function that makes an api call to fetch some data like so:
const data = await fethData()
const data = await fethData()
On chrome mv3 this works fine, but on firefox, I keep getting the error
Error: Permission denied to access property "then"
Error: Permission denied to access property "then"
...

Custom Font Isn't Working on Twitter

I've made a simple code to change the font on websites like Stack Overflow and Twitter. It works on Stack Overflow, but not on Twitter, where I get an error saying Refused to load the font 'data:font/ttf;base64. Could you take a look at my code and tell me how to fix it so it changes the font on Twitter too? https://github.com/sir-kokabi/test1...

Build variable to indicate "background" or "content" script?

Right now the only thing I can do to determine if a shared function is running in content or background is by checking "serviceWorker" in globalThis which unfortunately is a runtime check. Is there a variable (documented or not) that exists in env that would make it so code can be tree shaken? e.g. if (process.env.PLASMO_BUILD_TARGET !== "background") { ... } would allow the bundler to drop this branch if it's part of the background bundle. This is largely so I can share utility code between content and background where it performs all of its work in background (content scripts using messaging to background). Right now because I have to use a runtime check, a bunch of never used in content scripts code is included in the content scripts bundles....

how can I pcik suffix for files from lib, like main.web.js & main.native.js?

I am using a lib which exports both versions of files. my issue is it keeps resolving to the native version not web

Certain websites block content scripts

My content script UI works on nearly all websites except some, in particular Reddit. Here's what I see on Reddit. When I disable the extension, I don't see these messages on Reddit anymore. How can I get around this?...
No description

Create an anchor that selects every web page

how would i properly create an anchor that selects the top level element. the goal is to create a window on every single tab that is positioned in the bottom right. export const getOverlayAnchor: PlasmoGetOverlayAnchor = () => { return document.querySelector('html'); };...
No description

How to send some data from background.ts to content.ts file

I am trying to send a string from background.ts file to content.ts file. But I cannot find any documentation for that. I even tried with relay message but I am unable to get anything. Can anyone please help

Is there a way to create a project with multiple configurations

plasmo create --with-tailwindcss --with-nextjs --with-supabase only creates a project with tailwind...

How can i show an welcome page when users install my extension?

I attempted to implement the example found at PlasmoHQ's GitHub repository (https://github.com/PlasmoHQ/examples/tree/main/with-newtab) and followed the setup instructions detailed on the Plasmo framework documentation (https://docs.plasmo.com/framework/ext-pages). Although I can navigate to the page via chrome-extension://<extension-id>/tabs/test.html, the tab page does not automatically launch upon installation. Could you provide guidance on resolving this issue?

Messaging best practices

Do you recommend using Plasmo Messaging API instead of Chrome Messaging API ? Is a combination of both possible ? Thank you for your time!...

problem in staging and production modes

Hello everyone, I'm working on an extension and encountering an issue when building the extension in both staging and production modes. I get a "TypeError: Cannot read properties of undefined (reading 'transformOrigin')" error. I'm using Chakra UI, so maybe the problem lies there. Everything works fine in development mode. I would be very grateful for any help, thank you....

Framework-Understanding

Hi, I am building an chrome extension for recording sreen and webcam simultaneously using plasmo. I am a noob in the extension field but curious to explore. Facing difficulties in execution of my project. It would be great if I can get 15-20 mins. of plasmo dev time to clear all the issues. Thank u in advance 👍...

Help with showing script ui. (content.tsx) when clicking on chrome extension

Hi! I'm trying to show the script ui (modal content using a content script ui) when clicking on the chrome extension icon instead of showing a popup. I have this in content.tsx: ```typescript export const CustomModal = () => {...

How to send API requests with messaging?

Hey everyone, I can't seem to figure out on my own how to send API calls using Plasmo? I see a lot of 'earlier' posts saying to use the Messaging API, but how could I create a simple API call to e.g. my Supabase DB or anything else? I added a picture of what my "ideal" situation would be, if there is anyone with such experience needed I would love to know how you would tackle this....
Solution:
to use the messaging api you would need to use the sendToBackground function from @plasmo/messaging in the jsx/tsx/content script. you need to create a message handler in background/messages/<handler_name>. The handler is where you would perform the api fetch request. Given your provided case I don't think any use of the messaging api is needed since the popup should be able to use the credentials as is
No description

Dynamically change icon

How can I achieve this?

Plasmo Injected CSUI disappears on Click

I have a plasmo extension where i am injecting a component ui using conten script and i am making it conditionally rendered but here on the first go it is not working and when it works and click any component part which is injected, it disappears. Anyone has any idea about this?...

How to install a npm package?

I'm trying to build a chrome extension by using Plasmo, after initialize a project, and I installed other packages on npmjs. Such as npm i jwt-decode. But never works, I got the error like npm ERR! Cannot read properties of null (reading 'matches') or npm ERR! Cannot read properties of null (reading 'edgesOut'). Could anyone help? Thanks....

How to include JSON file referenced in manifest (Failed to resolve file.json)

I'm trying to setup "declarative_net_request" in the manifest. However whenever i include the resource "blocklist.json" I get the "failed to resolve" error. Here's my package.json: ```json { "name": "test", "displayName": "Test",...

Dynamic Configuration

Is there a way to dynamically generate the manifest. For example, if I'm doing a build, I'd want certain variables to be omitted, like the host, localhost, but for dev I'd want that to be in there. Is this possible?