deno create-solid Uncaught TypeError: Cannot set property navigator of #<Window>
Hi, now that deno's npm: specifiers have become standardized, I am hoping I can get solid-start up and running in deno. Unfortunately I cannot create a new project using the helper. It seems like solid is attempting to override window.navigator in the create-solid starter. Deno doesnt allow this (which I think makes a lot of sense). Is there a reason that this has to be done this way? A repro is below:
deno run -A --unstable npm:create-solid
error: Uncaught TypeError: Cannot set property navigator of #<Window> which has only a getter
at Object.set (deno:ext/node/01_node.js:42:26)
at Object.<anonymous> (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/create-solid/0.2.5/bin:1:269)
at Object.<anonymous> (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/create-solid/0.2.5/bin:109163:4)
at Module._compile (deno:ext/node/02_require.js:726:36)
at Object.Module._extensions..js (deno:ext/node/02_require.js:759:12)
at Module.load (deno:ext/node/02_require.js:643:34)
at Function.Module._load (deno:ext/node/02_require.js:500:14)
at loadCjsModule ([deno:cli/node/mod.rs:642:30]:2:42)
at [deno:cli/node/mod.rs:642:30]:3:7
followup question, why is the create-solid starter touching window at all? Does it accidentally assume this is a browser context because of the browser apis that deno supports? I did check that you are able to set window.navigator = {} within the browser. Still sort of confused why this is happening in a bin script though
commenting out the second line in file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/create-solid/0.2.5/bin seemed to do the trick. Im unsure where this line originally comes from, but I was able to generate a solid-start project in deno!
#!/usr/bin/env node
//global.navigator={}
I made a bit of progress (inside vite.config.js I needed to prefix the imports with npm:). It seems like I have a RangeError: Maximum call stack size exceeded error now though.
deno run -A --unstable --reload npm:solid-start start
Download ⠧ https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-
Download ⠇ https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-b
Download ⠇ https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.20.2.t
Download ⠇ https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-
Download ⠇ https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.
Download ⠇ https://registry.npmjs.org/@babel/plugin-proposal-export-namespace-from/-/plugin-proposal-expo
Download ⠇ https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-asser
Download ⠇ https://registry.npmjs.org/@babel/plugin-proposal-class-static-block/-/plugin-proposal-class-s
Download ⠇ https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-comp
Download ⠇ https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-
Download ⠇ https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.
solid-start start
version 0.2.5
Download ⠦ https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-
Download ⠧ https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-
Download ⠇ https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-
Download ⠋ https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-
Download ⠼ https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.20.2.t
Download ⠼ https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-pro
Download ⠼ https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate
Download ⠼ https://registry.npmjs.org/@babel/plugin-syntax-object-rest-spread/-/plugin-syntax-object-rest
Download ⠼ https://registry.npmjs.org/@babel/plugin-proposal-optional-catch-binding/-/plugin-proposal-opt
Download ⠼ https://registry.npmjs.org/@babel/plugin-syntax-async-generators/-/plugin-syntax-async-generat
Download ⠼ https://registry.npmjs.org/@babel/plugin-syntax-class-properties/-/plugin-syntax-class-propert
Download ⠼ https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.18
Download ⠧ https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructur
Download ⠇ https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructur
Download ⠋ https://registry.npmjs.org/babel-plugin-jsx-dom-expressions/-/babel-plugin-jsx-dom-expressions
Download ⠙ https://registry.npmjs.org/babel-plugin-jsx-dom-expressions/-/babel-plugin-jsx-dom-expressions
failed to load config from /Users/andrew.kaiser/Code/scratchwork/deno-solidjs-start/vite.config.ts
error: Uncaught (in promise) RangeError: Maximum call stack size exceeded
export function readdirSync(
^
at Object.readdirSync (https://deno.land/[email protected]/node/_fs/_fs_readdir.ts:110:17)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:546:20)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:548:10)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:548:10)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:548:10)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:548:10)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:548:10)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:548:10)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:548:10)
at find (file:///Users/andrew.kaiser/Library/Caches/deno/npm/registry.npmjs.org/solid-start/0.2.5/vite/plugin.js:548:10)
Does it accidentally assume this is a browser context because of the browser apis that deno supports?
solid relies on window to determine browser/server environment (not in a lot of places, but it's enough)
you can run solid in SPA mode with vite (not solid-start) https://twitter.com/JLarky/status/1582049727427751936
but only options to run solid on server are built on top of esbuild and not vite. I have a few links here in the video https://youtu.be/2nKVbbQFf7A?t=393
I believe deno can run esbuild, isnt the issue just that solid (start) is only detecting node/browser environments. If it detected a deno environment, would this work? Maybe there is some other lower level feature support that I am unaware of.
solid relies on window to determine browser/server environment (not in a lot of places, but it's enough)
@JLarky Do you know where? I honestly have tried to never rely on that since we've had isServer from the beginning and separate client and server builds. So I'm a bit surprised.
@nksaraf do you know why we set global.navigator?
I don't know why we would do that? We shouldn't be.. is there a place in the code we do? I can look at it and see what it's doing
I don't know why we would do that? We shouldn't be.. is there a place in the code we do? I can look at it and see what it's doing
@nksaraf it looks like it comes in from this: https://github.com/solidjs/solid-start/blob/main/packages/create-solid/rollup.config.js#L10
Not sure what this was doing but rollup is injecting it.
on mac if I just manually edit this file vi ~/Library/Caches/deno/npm/registry.npmjs.org/create-solid/0.2.8/bin it does have global.navigator={} in it. It seems like it is used later in the code to determine if you can use color in console.log but even after removing that like I see this error
$ deno run -A --unstable npm:create-solid
create-solid version 0.1.2
Welcome to the SolidStart setup wizard!
There are definitely bugs and some feature might not work yet.
If you encounter an issue, have a look at https://github.com/solidjs/solid-start/issues and open a new one, if it is not already tracked.
error: Uncaught TypeError: request_.setTimeout is not a function
at HttpsClientRequest.<anonymous> (file:///Users/jlarky/Library/Caches/deno/npm/registry.npmjs.org/create-solid/0.2.8/bin:108137:13)
at HttpsClientRequest.emit (https://deno.land/[email protected]/node/_events.mjs:391:35)
at HttpsClientRequest._final (https://deno.land/[email protected]/node/http.ts:142:10)
so now I removed that request_.setTimeout(0); line and it kind of works? terminal UI stuff doesn't seem like it can handle arrow keys, but at least 'Enter' works :D
so after it created a project, you expect to see deno run -A --unstable npm:solid-start dev to work, but it doesn't :) deno run -A --unstable npm:vite dev could probably work as well, I even tryied to change it to something like this:
// vite.config.js
import solid from "npm:solid-start/vite";
import { defineConfig } from "npm:vite";
export default defineConfig({
plugins: [
solid({
ssr: false,
}),
],
});
but with no luck :)
as for window thing, I think I already mentoned that on twitter that I don't remember when I saw that, but it seems like window check is probably the least of the problems at the moment :)
The create command we use will be replaced in the future.
In setting up for SolidStarts next Beta Phase built on Nitro and Vinxi we are closing all PRs/Issues that will not be merged due to the system changing. If you feel your issue was closed in mistake. Feel free to re-open it after updating/testing against 0.4.x release. Thank you for your patience. See https://github.com/solidjs/solid-start/pull/1139 for more details.