Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

vanilla js examples fail to build #243

Open
olizilla opened this issue Jan 12, 2023 · 0 comments
Open

vanilla js examples fail to build #243

olizilla opened this issue Jan 12, 2023 · 0 comments

Comments

@olizilla
Copy link
Contributor

While working on #242 I could not get the vanilla js examples to build. We want them to work good!

w3ui/examples/vanilla/sign-up-in on shared-example-tests •
❯ pnpm build

vite v3.2.5 building for production...
✓ 4 modules transformed.
[vite]: Rollup failed to resolve import "@ipld/dag-ucan/did" from "src/staging-service.js".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`
error during build:
Error: [vite]: Rollup failed to resolve import "@ipld/dag-ucan/did" from "src/staging-service.js".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`
    at onRollupWarning (file:///Users/oli/Code/web3-storage/w3ui/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:45832:19)
    at onwarn (file:///Users/oli/Code/web3-storage/w3ui/node_modules/.pnpm/[email protected]/node_modules/vite/dist/node/chunks/dep-5605cfa4.js:45603:13)
    at Object.onwarn (file:///Users/oli/Code/web3-storage/w3ui/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/rollup.js:23263:13)
    at ModuleLoader.handleResolveId (file:///Users/oli/Code/web3-storage/w3ui/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/rollup.js:22158:26)
    at file:///Users/oli/Code/web3-storage/w3ui/node_modules/.pnpm/[email protected]/node_modules/rollup/dist/es/shared/rollup.js:22119:26
 ELIFECYCLE  Command failed with exit code 1.
olizilla added a commit that referenced this issue Jan 16, 2023
Pulls example tests out to own dir so we can run the same test for each
ui library!

fixes: #222 

You can see it run in CI at
https://github.com/web3-storage/w3ui/actions/runs/3901558574/jobs/6663550379#step:6:13
and you can try it out locally from this branch by running:

```
$ pnpm install

# one time download of test browsers
$ pnpx playwright install

# fails for vanilla currently, but is ok, proceed.
$ pnpm build:examples 

$ pnpm test:examples

Scope: 20 of 33 workspace projects
examples/test/playwright test$ playwright test
[30 lines collapsed]
│ [30/33] [webkit] › sign-up-in.spec.ts:4:3 › vue: sign in
│ [31/33] [webkit] › uploads-list.spec.ts:4:3 › react: uploads list
│ [32/33] [webkit] › uploads-list.spec.ts:4:3 › solid: uploads list
│ [33/33] [webkit] › uploads-list.spec.ts:4:3 › vue: uploads list
│ 
│   33 passed (7s)
│ To open last HTML report run:
│ 
│   npx playwright show-report
│ 
└─ Done in 7.6s
```

_note: the build fails currently as our vanilla examples fail to build
currently, which is why we need these tests!_

Adds and updates run scripts to make it easy to run package or example
tests. Most of the time we'd want to run package tests locally, so this
is set as the default.

```bash
# runs package tests
$ pnpm test

# builkd examples. must be run before test so the dist dir exits for each
$ pnpm build:examples

# run example test
$ pnpm test:examples

# serve examples, so you can poke around as a dev. 
$ pnpm serve:examples
```

Updates examples to produce relative URLs by setting `base: ''` in vite
config. This allows us to serve all the examples from a single static
server in the `examples` dir, and `serve` is added with a `serve.json`
config to rewrite the paths so the `dist` dir is served for each
example.

Adds playwright config to fire up the example server

Adds github workflow to set up and run the browser tests only if we make
a change to the examples. We may change this to run for every change in
the future, as we should probably check if the examples still work if we
change a package!

Reduces the scope of our local github action to just handle setting up
node and pnpm which is needed by every workflow. `lint` and `test` are
now specified explicitly in workflows that should run them. We don't
need to run those steps when we're doing browser testing.

- Vanilla JS examples are not currently tested as they fail to build
#243 - we can fix in a
separate PR.
- We need a mechanism to be able to register a space from browser, or
add pre-registered test account fixture -
#244
- We are missing a `multi-file-upload` example -
#245




<img width="707" alt="Screenshot 2023-01-12 at 02 03 41"
src="https://user-images.githubusercontent.com/58871/211958353-b4a587a7-ead7-4957-b028-45b17c41f9a3.png">

<img width="1582" alt="Screenshot 2023-01-12 at 01 57 39"
src="https://user-images.githubusercontent.com/58871/211957738-0bfad4e5-a0e4-4ba6-8a13-ee05602f3adc.png">

**whoo!**
<img width="871" alt="Screenshot 2023-01-12 at 11 00 28"
src="https://user-images.githubusercontent.com/58871/212049726-68f86951-c244-4ed3-bde9-4ca3bfaa25ca.png">



License: MIT
Signed-off-by: Oli Evans <[email protected]>

Signed-off-by: Oli Evans <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant