🧩 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

Creating tests for CSUI React components with Jest

Heyo. I've been toying with the jest example in order to implement tests in an extension, but the lack of documentation and complexity of the example is giving me a lot of headaches getting everything working. The example doesn't deal with any imports in the example component, neither from static files, style files, parcel bundler imports, etc... So it makes it quite hard to figure out how to make it work with components that have any of them. Jest will complain to no end about it. Also, I'd rather deal with a different folder structure than having every test isolated in a single directory. I'd rather have each test stay with their respective tsx and scss component files, but the example configuration is quite obtuse as how it parses the test files (does it just look for the .test.ts(x) extension regardless of the location?)...

Mantine modals not rendering + styles are broken

I'm using a modal with https://mantine.dev/ but it's not rendering on the screen. When I inspect the modal, I'm only then able to see it on the bottom of the page and the mantine styles are not being applied to it

using getInlineAnchorList with Mantine

I'm trying to inject a Mantine button into multiple components at the same time using getInlineAnchorList() using document.querySelectorAll() and only the first button is rendering properly, the rest are unstyled mantine buttons

Using Plasmo with Mantine

I was able to successfully use https://mantine.dev/ for all my react components in the google extension popup, but I'm not able to get it to properly render the components in the injected react components

Storage hook `undefined` during initial render

Hey! I'm using the useStorage hook and noticed that during the initial render, it is undefined (default value) and then gets populated with the value from storage. I understand why this is the case (async data store vs sync rendering), however is there any way we can make it so that all storages are loaded before the rest of the application shows (i.e. no initial render with default values)?

How to access the current anchor in CSUI

Would it be possible to get current anchor inside the content component? Like if I'm mounting to multiple anchors and the logic needs to get input from a child element of that specific element @Jenya : https://discord.com/channels/946290204443025438/946290204904390690/1057702630404653057...

onInstalled event with Plasmo

Hi! Is it possible to use the runtime.onInstalled event with Plasmo?

Svelte - Unexpected token (parse-error)

It seems like Parcel fails to parse this in a Svelte popup: ```ts const errorMessage = { youtube: "Cannot assign. Used by YouTube", alreadyInUse: "Cannot assign. Already in use"...

Error opening a Svelte popup

I was greeted with this dogeconfused

Multiple Svelte CSUI injections

Sometimes, I'd like my extension to inject multiple components onto the web page, and some other times the web page is simply an SPA, so it happens that I will end up injecting multiple CSUIs Any projection on when Plasmo will support it?...

Best way to store JSON with storage API

Hello 😁 ! I am going to store some configuration data (in JSON) using the storage API. I am wondering what is the best way to do it using the usestorage hook. I was thinking of somehow using the onInit argument to parse the JSON but I'm not sure if that will work.

HMR Very Slow

I have to save my files a few times, and then still wait a while before any changes are reflected. The tab reloads, but the changes aren't present, any ideas?

getStyle doesn't work

I have content.ts: ```ts export const config: PlasmoContentScript = {...}; export const getStyle: PlasmoGetStyle () => {...

How do I check the size of my Plasmo cache

The cache is located in .plasmo/cache. The size of these files are the size of your cache.

How do I use Plasmo Canary?

What is Plasmo Canary and how do I use it?

Failed to connect to the HMR server

Plasmo's version is 0.60.0

Styling React components and ShadowDOM usage

Morning y'all, long time no see. Quite a while ago I removed the ShadowDOM implementation and injected the content script directly onto the root tree. I don't remember exactly why, I think it was an issue with font loading that I only got around when not using the shadow DOM. Anyways, that decision has ended up biting my ass back, and now I'm dealing with a lot of inconsistencies in the styling between sites due to the site styles bleeding into the extension. I've removed the getRootContainer export from my content script, and it's now in the Shadow DOM again... But it has absolutely no styling. Not from the site, not from the extension, nothing. It's just the HTML from the components....

Cannot run `plasmo dev`

Started happening after I upgraded to version 0.59.3-alpha-0 ```yaml [ThrowableDiagnostic [Error]: The plugin "@parcel/reporter-dev-server" is not compatible with the current version of Parcel. Requires "^2.8.0" but the current version is "2.0.0-nightly.1210+334e8a5ca".] { diagnostics: [ {...

How to use AMO's API to push an update

A folk at https://github.com/mozilla/addons/issues/1446 tried to help by referring to https://github.com/mozilla/web-ext/blob/master/src/util/submit-addon.js, but I couldn't get it to work despite copying the lines of putVersion Any idea what is missing?...