DEV Community

Discussion on: Writing Chrome Extensions Using Svelte-Kit and Manifest v3

Collapse
 
tohodo profile image
Tommy

Thanks for writing this up! I just tried to follow this tutorial using the latest version of SvelteKit (create-svelte version 2.0.0-next.115) and here was my experience...

  1. Upon running npm run build I got this error: "config.kit.target is no longer required, and should be removed"; so I removed this line and also reverted <div id="svelte"> back to <div> in app.html. After this change, the build was fine and I was able to locally install the extension.

  2. Upon clicking on the "Reveal current URL" button, the popup threw this JavaScript error: "Uncaught TypeError: Cannot read properties of null (reading 'parentNode') at script-13oyv3b}.js:4:62" -- the code in question is here:

import { start } from "/app/start-63ed0245.js";
start({
  target: document.querySelector('[data-hydrate="1r88ijv"]').parentNode,
  paths: {"base":"","assets":""},
  session: {},
  route: true,
  spa: false,
  trailing_slash: "never",
  hydrate: {
    status: 200,
    error: null,
    nodes: [
      import("/app/layout.svelte-733b8b62.js"),
        import("/app/pages/index.svelte-16d39772.js")
    ],
    url: new URL("http://sveltekit-prerender/"),
    params: {}
  }
});
Enter fullscreen mode Exit fullscreen mode

I'm not sure what's going on here, but it looks like it's not able to find an element with the data-hydrate attribute. Does anyone know what might be the problem?

Collapse
 
michmich112 profile image
Michel Canta

Fixed with v1.0.1-next.1. Thank you for commenting about this problem :)

Collapse
 
michmich112 profile image
Michel Canta

I know there were breaking changes in the new svelte version. I will check, there might be changes that need to be made to the adapter.