thetarnav / solid-devtools

Library of developer tools, reactivity debugger & Devtools Chrome extension for visualizing SolidJS reactivity graph
https://chrome.google.com/webstore/detail/solid-devtools/kmcfjchnmmaeeagadbhoofajiopoceel
MIT License
548 stars 21 forks source link

"Solid not detected" against Stackblitz demo on Chrome on Linux #266

Open lourot opened 1 year ago

lourot commented 1 year ago

I have opened the Stackblitz demo and followed the instructions:

// now to use the extension open the playground page in a new tab
// e.g. https://soliddevtoolsdemo-pd2g--5173.local-credentialless.webcontainer.io/
// open the devtools and a "Solid" panel should appear
// try refreshing if it doesn't work

// if you don't have the devools installed, here is the link:
// https://chrome.google.com/webstore/detail/solid-devtools/kmcfjchnmmaeeagadbhoofajiopoceel

Screenshot from 2023-10-03 18-06-20

The extension only says "Solid not detected". Other extensions are disabled. The console shows

Uncaught TypeError: O.createRoot is not a function
    at Hn (debugger.ts-2ca0ccc4.js:1:6771)
    at debugger.ts-2ca0ccc4.js:64:12559

Solid Devtools 0.27.7 Chrome 117.0.5938.132 Ubuntu 22.10

Any help appreciated, thanks a lot!

lourot commented 1 year ago

Actually now after having retried several times I do see

* Solid detected
* Solid development mode detected
* Solid Devtools setup detected

but I can't find any Solid tab in Chrome's developer tools.

The service worker log only says

solid-devtools Background script working.
lourot commented 1 year ago

And after refreshing the page, I'm back at "Solid not detected".

kauderk commented 10 months ago

Problem at "solid-devtools": "^0.27.1" but fixed at "solid-devtools": "^0.29.2", please update the Stackblitz Demo

This interface must have changed the createRoot function location.

var SolidApi = globalThis.SolidDevtools$$;
var solid_api_default = SolidApi;
...
...
var createInternalRoot = (fn, detachedOwner) => {
  InternalRootCount++;
  const r = solid_api_default.createRoot((dispose) => {
//                               ^^^
    solid_api_default.getOwner().isInternal = true;
    return fn(dispose);
  }, detachedOwner);
  InternalRootCount--;
  return r;
};

And here is the error

debugger.ts-fea24b99.js:434 Uncaught TypeError: solid_api_default.createRoot is not a function
    at createInternalRoot (debugger.ts-fea24b99.js:434:31)
    at debugger.ts-fea24b99.js:1810:14
createInternalRoot @ debugger.ts-fea24b99.js:434
(anonymous) @ debugger.ts-fea24b99.js:1810
apuatcfbd commented 9 months ago

In Solid Start (0.4.10) project. The extension says Solid is detected & following shows up in console

🚧 solid-devtools is in early development! 🚧
Please report any bugs to https://github.com/thetarnav/solid-devtools/issues

but there's no Solid tab in the (chrome) devtools

aquaductape commented 6 months ago

@lourot For the StackBlitz demo, you'll need to open the preview in new tab for extension to detect project and run.

Screenshot 2024-04-19 at 1 48 37 PM

but there's no Solid tab in the (chrome) devtools

@apuatcfbd The solution to reveal the tab is making sure that your devtools package is the exact same version number as the extension.

Currently the extension is 0.30.0, so update the package to 0.30.0 without any version flags.

"solid-devtools": "0.30.0"

Thankfully, recent version of extension reminds you of that. Here in my example project I installed the latest devtools package version which is 0.30.1, but the extension tells me it expects to use 0.30.0. So I should downgrade my devtools package to that version if the extension doesn't work.

Screenshot 2024-04-19 at 1 53 19 PM