jamps/qwik
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

chore: switch to vitest (#5300)

Browse Source 
* chore: update deps

ran npm-check -i on all package.json files and did manual sanity check for safe updates

* chore: dep fixes

* chore: pnpm api.update

* refactor(promise): rename then -> maybeThen

The export `then` breaks vitest:

https://github.com/vitest-dev/vitest/issues/1767

* chore: switch to vitest

most of the time just replace suite with test or describe, and use
assert.equal for minimal code changes.

* chore(tests): render-ssr no q:key innerhtml

these tests seem to have been incorrect

* fixup: added settings

---------

Co-authored-by: Miško Hevery <misko@hevery.com>
This commit is contained in:
Wout Mertens
2023-10-13 02:01:37 +02:00
committed by GitHub
parent 7a3191a5ce
commit fd7165c93d
104 changed files with 3560 additions and 3789 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.all-contributorsrc
View File

@@ -3,9 +3,7 @@
"projectOwner": "BuilderIO",
"repoType": "github",
"repoHost": "https://github.com",
"files": [
"README.md"
],
"files": ["README.md"],
"imageSize": 100,
"commit": true,
"commitConvention": "angular",

1
.gitignore vendored
View File

@@ -34,7 +34,6 @@ lib
tsdoc-metadata.json
# IDE and local environment
.vscode/settings.json
.idea
.eslintcache
test-results

3
.vscode/extensions.json vendored
View File

@@ -8,7 +8,8 @@
"ms-azuretools.vscode-docker",
"manucorporat.vermoji",
"vadimcn.vscode-lldb",
"streetsidesoftware.code-spell-checker"
"streetsidesoftware.code-spell-checker",
"ZixuanChen.vitest-explorer"
],
"unwantedRecommendations": []
}

15
.vscode/launch.json vendored
View File

@@ -22,21 +22,6 @@
"program": "${workspaceFolder}/node_modules/jest/bin/jest.js",
"cwd": "${workspaceFolder}",
"args": ["--runInBand", "--watchAll=false"]
},
{
"name": "uvu Current File",
"type": "node",
"request": "launch",
"skipFiles": ["<node_internals>/**"],
"program": "${workspaceFolder}/node_modules/tsm/bin.js",
"args": [
"${workspaceFolder}/node_modules/uvu/bin.js",
"${fileDirname}",
"${fileBasename}",
"--tsmconfig",
"${workspaceFolder}/tsm.cjs"
],
"console": "integratedTerminal"
}
]
}

10
.vscode/settings.json vendored Normal file
View File

@@ -0,0 +1,10 @@
{
"vitest.include": ["**/*.{test,spec,unit}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}"],
"vitest.exclude": [
"**/node_modules/**",
"**/dist/**",
"**/dist-dev/**",
"**/cypress/**",
"**/.{idea,git,cache,output,temp}/**"
]
}

10
CONTRIBUTING.md
View File

@@ -234,20 +234,12 @@ pnpm serve
### Unit Tests Only
Unit tests use [uvu](https://github.com/lukeed/uvu)
Unit tests use [vitest](https://vitest.dev)
```shell
pnpm test.unit
```
To keep _uvu_ open with the watch mode, run:
```shell
pnpm test.watch
```
> Note that the `test.watch` command isn't necessary if you're running the `pnpm start` command, since `start` will also concurrently run the _uvu_ watch process.
### E2E Tests Only
E2E tests use [Playwright](https://playwright.dev/).

67
package.json
View File

@@ -27,49 +27,48 @@
"esbuild-plugin-raw": "^0.1.7"
},
"devDependencies": {
"@builder.io/partytown": "^0.8.0",
"@builder.io/partytown": "^0.8.1",
"@clack/prompts": "^0.7.0",
"@microsoft/api-documenter": "^7.22.30",
"@microsoft/api-extractor": "7.36.3",
"@napi-rs/cli": "2.12.1",
"@microsoft/api-documenter": "^7.23.9",
"@microsoft/api-extractor": "^7.38.0",
"@napi-rs/cli": "^2.16.3",
"@napi-rs/triples": "1.1.0",
"@node-rs/helper": "1.3.3",
"@octokit/action": "3.18.1",
"@playwright/test": "1.36.2",
"@types/brotli": "1.3.1",
"@types/cross-spawn": "6.0.2",
"@types/eslint": "8.44.1",
"@types/express": "4.17.17",
"@types/mri": "1.1.1",
"@types/node": "^20.4.5",
"@playwright/test": "^1.38.1",
"@types/brotli": "^1.3.2",
"@types/cross-spawn": "^6.0.3",
"@types/eslint": "^8.44.4",
"@types/express": "^4.17.19",
"@types/mri": "^1.1.2",
"@types/node": "^20.8.4",
"@types/path-browserify": "1.0.0",
"@types/prettier": "2.7.3",
"@types/prompts": "2.4.4",
"@types/semver": "7.5.0",
"@types/prompts": "^2.4.6",
"@types/semver": "^7.5.3",
"@types/which-pm-runs": "1.0.0",
"@typescript-eslint/eslint-plugin": "6.2.0",
"@typescript-eslint/parser": "6.2.0",
"@typescript-eslint/rule-tester": "^6.2.0",
"@typescript-eslint/utils": "6.2.0",
"@typescript-eslint/eslint-plugin": "^6.7.5",
"@typescript-eslint/parser": "^6.7.5",
"@typescript-eslint/rule-tester": "^6.7.5",
"@typescript-eslint/utils": "^6.7.5",
"all-contributors-cli": "6.26.1",
"brotli": "1.3.3",
"commitizen": "4.3.0",
"concurrently": "8.2.0",
"concurrently": "^8.2.1",
"create-qwik": "workspace:*",
"cross-spawn": "7.0.3",
"cz-conventional-changelog": "3.3.0",
"esbuild": "0.18.17",
"eslint": "8.45.0",
"esbuild": "^0.19.4",
"eslint": "^8.51.0",
"eslint-plugin-no-only-tests": "3.1.0",
"eslint-plugin-qwik": "1.2.6",
"eslint-plugin-qwik": "^1.2.13",
"execa": "7.2.0",
"express": "4.18.2",
"install": "^0.13.0",
"monaco-editor": "^0.39.0",
"monaco-editor": "^0.44.0",
"mri": "1.2.0",
"ora": "6.3.1",
"path-browserify": "1.0.1",
"prettier": "3.0.0",
"prettier": "^3.0.3",
"prettier-plugin-jsdoc": "^1.1.1",
"pretty-quick": "^3.1.3",
"prompts": "2.4.2",
@@ -77,16 +76,16 @@
"semver": "7.5.4",
"snoop": "^1.0.4",
"syncpack": "^10.7.3",
"terser": "5.19.2",
"tsm": "2.2.2",
"typescript": "5.1.6",
"undici": "5.22.1",
"uvu": "0.5.6",
"vite": "4.4.7",
"vite-tsconfig-paths": "4.2.0",
"terser": "^5.21.0",
"tsm": "^2.3.0",
"typescript": "^5.2.2",
"undici": "^5.26.0",
"vite": "^4.4.11",
"vite-tsconfig-paths": "^4.2.1",
"vitest": "0.34.6",
"watchlist": "0.3.1",
"which-pm-runs": "1.1.0",
"zod": "^3.21.4"
"zod": "^3.22.4"
},
"engines": {
"node": ">=16.8.0 <18.0.0 || >=18.11",
@@ -148,8 +147,8 @@
"test.e2e.firefox": "playwright test starters --browser=firefox --config starters/playwright.config.ts",
"test.e2e.webkit": "playwright test starters --browser=webkit --config starters/playwright.config.ts",
"test.rust": "make test",
"test.unit": "tsm node_modules/uvu/bin.js packages unit.ts --tsmconfig tsm.cjs",
"test.unit.debug": "tsm --inspect-brk node_modules/uvu/bin.js packages unit.ts --tsmconfig tsm.cjs",
"test.unit": "vitest packages",
"test.unit.debug": "vitest --inspect-brk packages",
"test.vite": "playwright test starters/e2e/qwikcity --browser=chromium --config starters/playwright.config.ts",
"test.watch": "watchlist packages unit.ts -- pnpm test.unit",
"tsc.check": "tsc --noEmit",

2
packages/create-qwik/package.json
View File

@@ -7,7 +7,7 @@
"bugs": "https://github.com/BuilderIO/qwik/issues",
"devDependencies": {
"@clack/prompts": "^0.7.0",
"@types/yargs": "17.0.24",
"@types/yargs": "^17.0.28",
"kleur": "4.1.5",
"yargs": "17.7.2"
},

49
packages/docs/package.json
View File

@@ -7,49 +7,48 @@
"devDependencies": {
"@algolia/autocomplete-core": "1.7.4",
"@algolia/client-search": "4.14.3",
"@builder.io/partytown": "^0.8.0",
"@builder.io/partytown": "^0.8.1",
"@builder.io/qwik": "github:BuilderIo/qwik-build#d3722d228e541225f75068160287811ee900a29c",
"@builder.io/qwik-city": "github:BuilderIo/qwik-city-build#86e0034604ef6ecb2e50e7b3c2c2b8f3a36b0118",
"@builder.io/qwik-labs": "github:BuilderIo/qwik-labs-build#f93ef76256c988d57acd24cc5d59ebf2e39c3d02",
"@builder.io/qwik-react": "0.5.0",
"@builder.io/sdk-qwik": "^0.4.5",
"@docsearch/css": "3.3.4",
"@builder.io/sdk-qwik": "^0.6.2",
"@docsearch/css": "^3.5.2",
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"@modular-forms/qwik": "^0.21.0",
"@mui/material": "^5.13.0",
"@mui/x-data-grid": "^6.4.0",
"@supabase/supabase-js": "^2.33.1",
"@types/prismjs": "^1.26.0",
"@types/react": "18.2.17",
"@types/react-dom": "18.2.7",
"@unpic/core": "^0.0.28",
"@unpic/qwik": "^0.0.24",
"@mui/material": "^5.14.13",
"@mui/x-data-grid": "^6.16.1",
"@supabase/supabase-js": "^2.38.0",
"@types/prismjs": "^1.26.1",
"@types/react": "^18.2.28",
"@types/react-dom": "^18.2.13",
"@unpic/core": "^0.0.31",
"@unpic/qwik": "^0.0.27",
"algoliasearch": "4.16.0",
"autoprefixer": "^10.4.14",
"fflate": "0.8.0",
"autoprefixer": "^10.4.16",
"fflate": "^0.8.1",
"gray-matter": "4.0.3",
"openai": "^3.3.0",
"postcss": "8.4.27",
"prettier": "3.0.0",
"postcss": "^8.4.31",
"prettier": "^3.0.3",
"prism-themes": "1.9.0",
"prismjs": "1.29.0",
"puppeteer": "^20.9.0",
"qwik-image": "^0.0.7",
"qwik-image": "^0.0.8",
"react": "18.2.0",
"react-dom": "18.2.0",
"rehype-pretty-code": "0.9.8",
"shiki": "^0.14.3",
"rehype-pretty-code": "^0.10.1",
"shiki": "^0.14.5",
"snarkdown": "^2.0.0",
"tailwindcss": "3.3.3",
"tsm": "2.2.2",
"typescript": "5.1.6",
"undici": "5.22.1",
"uvu": "0.5.6",
"tsm": "^2.3.0",
"typescript": "^5.2.2",
"undici": "^5.26.0",
"valibot": "^0.17.1",
"vite": "4.4.7",
"vite-plugin-inspect": "^0.7.33",
"wrangler": "^3.3.0"
"vite": "^4.4.11",
"vite-plugin-inspect": "^0.7.40",
"wrangler": "^3.11.0"
},
"engines": {
"node": ">=18.11",

16
packages/docs/src/repl/repl-share-url.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import * as assert from 'uvu/assert';
import { assert, test } from 'vitest';
import {
filesToStr,
strToFiles,
@@ -32,19 +31,22 @@ test('filesToStr', () => {
);
});
test('round trip str', () => {
assert.equal(strToFiles(filesToStr(data.files)), data.files);
assert.deepEqual(strToFiles(filesToStr(data.files)), data.files);
});
test('compressFiles', () => {
assert.equal(compressFiles(data.files), 'M6tJy8/XyyoGeqYGub5UAgoraVrXmNUkJRZhkwcKA+UB');
});
test('parseCompressedFiles', () => {
assert.equal(parseCompressedFiles('M6tJy8/XyyoGeqYGub5UAgoraVrXmNUkJRZhkwcKA+UB'), data.files);
assert.deepEqual(
parseCompressedFiles('M6tJy8/XyyoGeqYGub5UAgoraVrXmNUkJRZhkwcKA+UB'),
data.files
);
});
test('round trip compressed', () => {
assert.equal(parseCompressedFiles(compressFiles(data.files)), data.files);
assert.deepEqual(parseCompressedFiles(compressFiles(data.files)), data.files);
});
test('createPlaygroundShareUrl', () => {
assert.equal(
assert.deepEqual(
createPlaygroundShareUrl(data),
'/playground/#v=1.2.3&f=M6tJy8%2FXyyoGeqYGub5UAgoraVrXmNUkJRZhkwcKA%2BUB'
);
@@ -67,5 +69,3 @@ test('dictionary is unchanged', () => {
"0||1448|<div> </div> </button> props: class return ( story component$( store string state export const span type href={ page strong count useSignal< useStore< qwik import { } from searchInput console.log( searchResults builder useTask$( stories style={ news export default data </article> track onClick$= new nav map link debounced controller user useStyles$( useStylesScoped$( url title timeoutId time_ago second response Date.now() minute main item interface hour disabled aria any State update transform the target suggestion setTimeout selectedValue rotate render people number list label https:// header deg debouncedGetPeople debounce component comments_count comments clock background await new Promise args SuggestionsListComponent IStory IState IComment GrandChild Clock Child AutoComplete 360 yellow with view useVisibleTask$( true tmrId timer then swapi styles signal section search results resolve rel prev points parsedResponse null noreferrer name more length json job items isServer index github getPeople function fetch example domain dev delay css container com click clearTimeout async api _blank Star Wars API This The StoryPreview Stories ReturnType Qwik App Page Nav HackerNewsCSS AbortController server$( routeAction$( routeLoader$( useContent( useDocumentHead( useLocation( useNavigate( validator$( zod$( noSerialize( </Slot> useComputed$( useOnDocument( useOnWindow( useResource$( useContext( useContextProvider( createContextId<|8|/app.tsx|114|import { component$ } from '@builder.io/qwik';\n\nexport default component$(() => {\n return <p>Hello Qwik</p>;\n});\n|17|/entry.server.tsx|201|import { renderToString, type RenderOptions } from '@builder.io/qwik/server';\nimport { Root } from './root';\n\nexport default function (opts: RenderOptions) {\n return renderToString(<Root />, opts);\n}\n|9|/root.tsx|192|import App from './app';\n\nexport const Root = () => {\n return (\n <>\n <head>\n <title>Hello Qwik</title>\n </head>\n <body>\n <App />\n </body>\n </>\n );\n};\n"
);
});
test.run();

31
packages/docs/src/routes/api/qwik-city-vite-bun-server/api.json
View File

@@ -1,5 +1,34 @@
{
"id": "qwik-city-vite-bun-server",
"package": "@builder.io/qwik-city/vite/bun-server",
"members": []
"members": [
{
"name": "bunServerAdapter",
"id": "bunserveradapter",
"hierarchy": [
{
"name": "bunServerAdapter",
"id": "bunserveradapter"
}
],
"kind": "Function",
"content": "> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.\n> \n\n\n\n```typescript\nexport declare function bunServerAdapter(opts?: bunServerAdapterOptions): any;\n```\n\n\n| Parameter | Type | Description |\n| --- | --- | --- |\n| opts | [bunServerAdapterOptions](#bunserveradapteroptions) | _(Optional)_ |\n\n**Returns:**\n\nany",
"editUrl": "https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/adapters/bun-server/vite/index.ts",
"mdFile": "qwik-city.bunserveradapter.md"
},
{
"name": "bunServerAdapterOptions",
"id": "bunserveradapteroptions",
"hierarchy": [
{
"name": "bunServerAdapterOptions",
"id": "bunserveradapteroptions"
}
],
"kind": "Interface",
"content": "> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.\n> \n\n\n\n```typescript\nexport interface bunServerAdapterOptions extends ServerAdapterOptions \n```\n**Extends:** ServerAdapterOptions\n\n\n| Property | Modifiers | Type | Description |\n| --- | --- | --- | --- |\n| [name?](#) | | string | **_(ALPHA)_** _(Optional)_ |",
"editUrl": "https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/adapters/bun-server/vite/index.ts",
"mdFile": "qwik-city.bunserveradapteroptions.md"
}
]
}

34
packages/docs/src/routes/api/qwik-city-vite-bun-server/index.md
View File

@@ -3,3 +3,37 @@ title: \@builder.io/qwik-city/vite/bun-server API Reference
---
# [API](/api) &rsaquo; @builder.io/qwik-city/vite/bun-server
## bunServerAdapter
> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
```typescript
export declare function bunServerAdapter(opts?: bunServerAdapterOptions): any;
```
| Parameter | Type | Description |
| --------- | --------------------------------------------------- | ------------ |
| opts | [bunServerAdapterOptions](#bunserveradapteroptions) | _(Optional)_ |
**Returns:**
any
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/adapters/bun-server/vite/index.ts)
## bunServerAdapterOptions
> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
```typescript
export interface bunServerAdapterOptions extends ServerAdapterOptions
```
**Extends:** ServerAdapterOptions
| Property | Modifiers | Type | Description |
| ---------- | --------- | ------ | -------------------------- |
| [name?](#) | | string | **_(ALPHA)_** _(Optional)_ |
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/adapters/bun-server/vite/index.ts)

31
packages/docs/src/routes/api/qwik-city-vite-node-server/api.json
View File

@@ -1,5 +1,34 @@
{
"id": "qwik-city-vite-node-server",
"package": "@builder.io/qwik-city/vite/node-server",
"members": []
"members": [
{
"name": "nodeServerAdapter",
"id": "nodeserveradapter",
"hierarchy": [
{
"name": "nodeServerAdapter",
"id": "nodeserveradapter"
}
],
"kind": "Function",
"content": "> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.\n> \n\n\n\n```typescript\nexport declare function nodeServerAdapter(opts?: NodeServerAdapterOptions): any;\n```\n\n\n| Parameter | Type | Description |\n| --- | --- | --- |\n| opts | [NodeServerAdapterOptions](#nodeserveradapteroptions) | _(Optional)_ |\n\n**Returns:**\n\nany",
"editUrl": "https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/adapters/node-server/vite/index.ts",
"mdFile": "qwik-city.nodeserveradapter.md"
},
{
"name": "NodeServerAdapterOptions",
"id": "nodeserveradapteroptions",
"hierarchy": [
{
"name": "NodeServerAdapterOptions",
"id": "nodeserveradapteroptions"
}
],
"kind": "Interface",
"content": "> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.\n> \n\n\n\n```typescript\nexport interface NodeServerAdapterOptions extends ServerAdapterOptions \n```\n**Extends:** ServerAdapterOptions\n\n\n| Property | Modifiers | Type | Description |\n| --- | --- | --- | --- |\n| [name?](#) | | string | **_(ALPHA)_** _(Optional)_ |",
"editUrl": "https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/adapters/node-server/vite/index.ts",
"mdFile": "qwik-city.nodeserveradapteroptions.md"
}
]
}

34
packages/docs/src/routes/api/qwik-city-vite-node-server/index.md
View File

@@ -3,3 +3,37 @@ title: \@builder.io/qwik-city/vite/node-server API Reference
---
# [API](/api) &rsaquo; @builder.io/qwik-city/vite/node-server
## nodeServerAdapter
> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
```typescript
export declare function nodeServerAdapter(opts?: NodeServerAdapterOptions): any;
```
| Parameter | Type | Description |
| --------- | ----------------------------------------------------- | ------------ |
| opts | [NodeServerAdapterOptions](#nodeserveradapteroptions) | _(Optional)_ |
**Returns:**
any
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/adapters/node-server/vite/index.ts)
## NodeServerAdapterOptions
> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
```typescript
export interface NodeServerAdapterOptions extends ServerAdapterOptions
```
**Extends:** ServerAdapterOptions
| Property | Modifiers | Type | Description |
| ---------- | --------- | ------ | -------------------------- |
| [name?](#) | | string | **_(ALPHA)_** _(Optional)_ |
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/adapters/node-server/vite/index.ts)

16
packages/docs/src/routes/api/qwik-city/api.json
View File

@@ -110,7 +110,7 @@
}
],
"kind": "Interface",
"content": "```typescript\nexport interface DocumentHeadValue \n```\n\n\n| Property | Modifiers | Type | Description |\n| --- | --- | --- | --- |\n| [frontmatter?](#) | <code>readonly</code> | Readonly&lt;Record&lt;string, any&gt;&gt; | _(Optional)_ Arbitrary object containing custom data. When the document head is created from markdown files, the frontmatter attributes that are not recognized as a well-known meta names (such as title, description, author, etc...), are stored in this property. |\n| [links?](#) | <code>readonly</code> | readonly [DocumentLink](#documentlink)<!-- -->\\[\\] | _(Optional)_ Used to manually append <code>&lt;link&gt;</code> elements to the <code>&lt;head&gt;</code>. |\n| [meta?](#) | <code>readonly</code> | readonly [DocumentMeta](#documentmeta)<!-- -->\\[\\] | _(Optional)_ Used to manually set meta tags in the head. Additionally, the <code>data</code> property could be used to set arbitrary data which the <code>&lt;head&gt;</code> component could later use to generate <code>&lt;meta&gt;</code> tags. |\n| [scripts?](#) | <code>readonly</code> | readonly DocumentScript\\[\\] | _(Optional)_ Used to manually append <code>&lt;script&gt;</code> elements to the <code>&lt;head&gt;</code>. |\n| [styles?](#) | <code>readonly</code> | readonly [DocumentStyle](#documentstyle)<!-- -->\\[\\] | _(Optional)_ Used to manually append <code>&lt;style&gt;</code> elements to the <code>&lt;head&gt;</code>. |\n| [title?](#) | <code>readonly</code> | string | _(Optional)_ Sets <code>document.title</code>. |",
"content": "```typescript\nexport interface DocumentHeadValue \n```\n\n\n| Property | Modifiers | Type | Description |\n| --- | --- | --- | --- |\n| [frontmatter?](#) | <code>readonly</code> | Readonly&lt;Record&lt;string, any&gt;&gt; | _(Optional)_ Arbitrary object containing custom data. When the document head is created from markdown files, the frontmatter attributes that are not recognized as a well-known meta names (such as title, description, author, etc...), are stored in this property. |\n| [links?](#) | <code>readonly</code> | readonly [DocumentLink](#documentlink)<!-- -->\\[\\] | _(Optional)_ Used to manually append <code>&lt;link&gt;</code> elements to the <code>&lt;head&gt;</code>. |\n| [meta?](#) | <code>readonly</code> | readonly [DocumentMeta](#documentmeta)<!-- -->\\[\\] | _(Optional)_ Used to manually set meta tags in the head. Additionally, the <code>data</code> property could be used to set arbitrary data which the <code>&lt;head&gt;</code> component could later use to generate <code>&lt;meta&gt;</code> tags. |\n| [scripts?](#) | <code>readonly</code> | readonly [DocumentScript](#documentscript)<!-- -->\\[\\] | _(Optional)_ Used to manually append <code>&lt;script&gt;</code> elements to the <code>&lt;head&gt;</code>. |\n| [styles?](#) | <code>readonly</code> | readonly [DocumentStyle](#documentstyle)<!-- -->\\[\\] | _(Optional)_ Used to manually append <code>&lt;style&gt;</code> elements to the <code>&lt;head&gt;</code>. |\n| [title?](#) | <code>readonly</code> | string | _(Optional)_ Sets <code>document.title</code>. |",
"editUrl": "https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/runtime/src/types.ts",
"mdFile": "qwik-city.documentheadvalue.md"
},
@@ -142,6 +142,20 @@
"editUrl": "https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/runtime/src/types.ts",
"mdFile": "qwik-city.documentmeta.md"
},
{
"name": "DocumentScript",
"id": "documentscript",
"hierarchy": [
{
"name": "DocumentScript",
"id": "documentscript"
}
],
"kind": "Interface",
"content": "> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.\n> \n\n\n\n```typescript\nexport interface DocumentScript \n```\n\n\n| Property | Modifiers | Type | Description |\n| --- | --- | --- | --- |\n| [key?](#) | <code>readonly</code> | string | **_(ALPHA)_** _(Optional)_ |\n| [props?](#) | <code>readonly</code> | Readonly&lt;QwikIntrinsicElements\\['script'\\]&gt; | **_(ALPHA)_** _(Optional)_ |\n| [script?](#) | <code>readonly</code> | string | **_(ALPHA)_** _(Optional)_ |",
"editUrl": "https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/runtime/src/types.ts",
"mdFile": "qwik-city.documentscript.md"
},
{
"name": "DocumentStyle",
"id": "documentstyle",

32
packages/docs/src/routes/api/qwik-city/index.md
View File

@@ -119,14 +119,14 @@ export interface DocumentHeadProps extends RouteLocation
export interface DocumentHeadValue
```
| Property | Modifiers | Type | Description |
| ----------------- | --------------------- | ------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [frontmatter?](#) | <code>readonly</code> | Readonly&lt;Record&lt;string, any&gt;&gt; | _(Optional)_ Arbitrary object containing custom data. When the document head is created from markdown files, the frontmatter attributes that are not recognized as a well-known meta names (such as title, description, author, etc...), are stored in this property. |
| [links?](#) | <code>readonly</code> | readonly [DocumentLink](#documentlink)[] | _(Optional)_ Used to manually append <code>&lt;link&gt;</code> elements to the <code>&lt;head&gt;</code>. |
| [meta?](#) | <code>readonly</code> | readonly [DocumentMeta](#documentmeta)[] | _(Optional)_ Used to manually set meta tags in the head. Additionally, the <code>data</code> property could be used to set arbitrary data which the <code>&lt;head&gt;</code> component could later use to generate <code>&lt;meta&gt;</code> tags. |
| [scripts?](#) | <code>readonly</code> | readonly DocumentScript[] | _(Optional)_ Used to manually append <code>&lt;script&gt;</code> elements to the <code>&lt;head&gt;</code>. |
| [styles?](#) | <code>readonly</code> | readonly [DocumentStyle](#documentstyle)[] | _(Optional)_ Used to manually append <code>&lt;style&gt;</code> elements to the <code>&lt;head&gt;</code>. |
| [title?](#) | <code>readonly</code> | string | _(Optional)_ Sets <code>document.title</code>. |
| Property | Modifiers | Type | Description |
| ----------------- | --------------------- | -------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [frontmatter?](#) | <code>readonly</code> | Readonly&lt;Record&lt;string, any&gt;&gt; | _(Optional)_ Arbitrary object containing custom data. When the document head is created from markdown files, the frontmatter attributes that are not recognized as a well-known meta names (such as title, description, author, etc...), are stored in this property. |
| [links?](#) | <code>readonly</code> | readonly [DocumentLink](#documentlink)[] | _(Optional)_ Used to manually append <code>&lt;link&gt;</code> elements to the <code>&lt;head&gt;</code>. |
| [meta?](#) | <code>readonly</code> | readonly [DocumentMeta](#documentmeta)[] | _(Optional)_ Used to manually set meta tags in the head. Additionally, the <code>data</code> property could be used to set arbitrary data which the <code>&lt;head&gt;</code> component could later use to generate <code>&lt;meta&gt;</code> tags. |
| [scripts?](#) | <code>readonly</code> | readonly [DocumentScript](#documentscript)[] | _(Optional)_ Used to manually append <code>&lt;script&gt;</code> elements to the <code>&lt;head&gt;</code>. |
| [styles?](#) | <code>readonly</code> | readonly [DocumentStyle](#documentstyle)[] | _(Optional)_ Used to manually append <code>&lt;style&gt;</code> elements to the <code>&lt;head&gt;</code>. |
| [title?](#) | <code>readonly</code> | string | _(Optional)_ Sets <code>document.title</code>. |
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/runtime/src/types.ts)
@@ -176,6 +176,22 @@ export interface DocumentMeta
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/runtime/src/types.ts)
## DocumentScript
> This API is provided as an alpha preview for developers and may change based on feedback that we receive. Do not use this API in a production environment.
```typescript
export interface DocumentScript
```
| Property | Modifiers | Type | Description |
| ------------ | --------------------- | ----------------------------------------------- | -------------------------- |
| [key?](#) | <code>readonly</code> | string | **_(ALPHA)_** _(Optional)_ |
| [props?](#) | <code>readonly</code> | Readonly&lt;QwikIntrinsicElements['script']&gt; | **_(ALPHA)_** _(Optional)_ |
| [script?](#) | <code>readonly</code> | string | **_(ALPHA)_** _(Optional)_ |
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik-city/runtime/src/types.ts)
## DocumentStyle
```typescript

20
packages/docs/src/routes/api/qwik/index.md
View File

@@ -29,7 +29,7 @@ Qwik Optimizer marker function.
Use `$(...)` to tell Qwik Optimizer to extract the expression in `$(...)` into a lazy-loadable resource referenced by `QRL`.
```typescript
$: <T,>(expression: T) => QRL<T>;
$: <T>(expression: T) => QRL<T>;
```
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik/src/core/qrl/qrl.public.ts)
@@ -630,7 +630,7 @@ export const Items = component$(() => {
```
```typescript
createContextId: <STATE = unknown,>(name: string) => ContextId<STATE>;
createContextId: <STATE = unknown>(name: string) => ContextId<STATE>;
```
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik/src/core/use/use-context.ts)
@@ -791,7 +791,7 @@ export interface ErrorBoundaryStore
## event$
```typescript
event$: <T,>(first: T) => QRL<T>;
event$: <T>(first: T) => QRL<T>;
```
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik/src/core/qrl/qrl.public.ts)
@@ -799,7 +799,7 @@ event$: <T,>(first: T) => QRL<T>;
## eventQrl
```typescript
eventQrl: <T,>(qrl: QRL<T>) => QRL<T>;
eventQrl: <T>(qrl: QRL<T>) => QRL<T>;
```
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik/src/core/qrl/qrl.public.ts)
@@ -2168,7 +2168,7 @@ Used by Qwik Optimizer to point to lazy-loaded resources.
This function should be used by the Qwik Optimizer only. The function should not be directly referred to in the source code of the application.
```typescript
qrl: <T = any,>(
qrl: <T = any>(
chunkOrFn: string | (() => Promise<any>),
symbol: string,
lexicalScopeCapture?: any[],
@@ -2185,7 +2185,7 @@ Used by Qwik Optimizer to point to lazy-loaded resources.
This function should be used by the Qwik Optimizer only. The function should not be directly referred to in the source code of the application.
```typescript
qrl: <T = any,>(
qrl: <T = any>(
chunkOrFn: string | (() => Promise<any>),
symbol: string,
lexicalScopeCapture?: any[],
@@ -2670,7 +2670,7 @@ const Cmp = component$(() => {
```
```typescript
Resource: <T,>(props: ResourceProps<T>) => JSXNode;
Resource: <T>(props: ResourceProps<T>) => JSXNode;
```
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik/src/core/use/use-resource.ts)
@@ -3571,7 +3571,7 @@ export interface TrackHTMLAttributes<T extends Element> extends HTMLAttributes<T
## untrack
```typescript
untrack: <T,>(fn: () => T) => T;
untrack: <T>(fn: () => T) => T;
```
[Edit this section](https://github.com/BuilderIO/qwik/tree/main/packages/qwik/src/core/use/use-core.ts)
@@ -3791,7 +3791,7 @@ const Cmp = component$(() => {
```
```typescript
useResource$: <T,>(generatorFn: ResourceFn<T>, opts?: ResourceOptions) =>
useResource$: <T>(generatorFn: ResourceFn<T>, opts?: ResourceOptions) =>
ResourceReturn<T>;
```
@@ -3846,7 +3846,7 @@ const Cmp = component$(() => {
```
```typescript
useResourceQrl: <T,>(qrl: QRL<ResourceFn<T>>, opts?: ResourceOptions) =>
useResourceQrl: <T>(qrl: QRL<ResourceFn<T>>, opts?: ResourceOptions) =>
ResourceReturn<T>;
```

10
packages/eslint-plugin-qwik/package.json
View File

@@ -5,13 +5,13 @@
"author": "Builder Team",
"bugs": "https://github.com/BuilderIO/qwik/issues",
"dependencies": {
"jsx-ast-utils": "^3.3.4"
"jsx-ast-utils": "^3.3.5"
},
"devDependencies": {
"@types/eslint": "8.44.1",
"@types/estree": "^1.0.1",
"@typescript-eslint/rule-tester": "^6.2.0",
"@typescript-eslint/utils": "6.2.0",
"@types/eslint": "^8.44.4",
"@types/estree": "^1.0.2",
"@typescript-eslint/rule-tester": "^6.7.5",
"@typescript-eslint/utils": "^6.7.5",
"redent": "^4.0.0"
},
"engines": {

22
packages/eslint-plugin-qwik/qwik.unit.ts
View File

@@ -1,11 +1,16 @@
/* eslint-disable */
import * as vitest from 'vitest';
// @ts-ignore
import { RuleTester } from '@typescript-eslint/rule-tester';
import { fileURLToPath } from 'node:url';
import { rules } from './index';
import { suite } from 'uvu';
const lintSuite = suite('lint');
// https://typescript-eslint.io/packages/rule-tester/#vitest
RuleTester.afterAll = vitest.afterAll;
RuleTester.it = vitest.it;
RuleTester.itOnly = vitest.it.only;
RuleTester.describe = vitest.describe;
const testConfig = {
parser: '@typescript-eslint/parser',
env: {
@@ -22,13 +27,6 @@ const testConfig = {
},
};
RuleTester.afterAll = lintSuite.after;
RuleTester.it = lintSuite;
RuleTester.itOnly = lintSuite.only;
RuleTester.describe = function (_, method) {
return method.call(this);
};
const ruleTester = new RuleTester(testConfig as any);
ruleTester.run('use-method-usage', rules['use-method-usage'] as any, {
valid: [
@@ -717,7 +715,3 @@ ruleTester.run('qwik/loader-location', rules['loader-location'], {
},
],
});
lintSuite.run();
export {};

36
packages/insights/package.json
View File

@@ -4,13 +4,13 @@
"dependencies": {
"@auth/core": "^0.7.1",
"@builder.io/qwik-auth": "0.1.0",
"@libsql/client": "^0.3.1",
"@libsql/client": "^0.3.5",
"@modular-forms/qwik": "^0.12.0",
"@typescript/analyze-trace": "^0.10.0",
"@typescript/analyze-trace": "^0.10.1",
"density-clustering": "^1.3.0",
"dotenv": "^16.3.1",
"drizzle-kit": "^0.19.13",
"drizzle-orm": "0.28.3",
"drizzle-orm": "0.28.6",
"install": "^0.13.0"
},
"devDependencies": {
@@ -18,22 +18,22 @@
"@builder.io/qwik-city": "github:BuilderIo/qwik-city-build#86e0034604ef6ecb2e50e7b3c2c2b8f3a36b0118",
"@builder.io/qwik-labs": "workspace:*",
"@builder.io/vite-plugin-macro": "~0.0.7",
"@netlify/edge-functions": "^2.0.0",
"@netlify/edge-functions": "^2.2.0",
"@pandacss/dev": "^0.8.0",
"@types/density-clustering": "^1.3.0",
"@types/eslint": "8.44.1",
"@types/node": "^20.4.5",
"@typescript-eslint/eslint-plugin": "6.2.0",
"@typescript-eslint/parser": "6.2.0",
"eslint": "8.45.0",
"eslint-plugin-qwik": "1.2.6",
"@types/density-clustering": "^1.3.1",
"@types/eslint": "^8.44.4",
"@types/node": "^20.8.4",
"@typescript-eslint/eslint-plugin": "^6.7.5",
"@typescript-eslint/parser": "^6.7.5",
"eslint": "^8.51.0",
"eslint-plugin-qwik": "^1.2.13",
"netlify-cli": "^15.9.1",
"prettier": "3.0.0",
"prettier": "^3.0.3",
"typescript": "5.2.2",
"undici": "5.22.1",
"uvu": "0.5.6",
"vite": "4.4.7",
"vite-tsconfig-paths": "4.2.0"
"undici": "^5.26.0",
"vite": "^4.4.11",
"vite-tsconfig-paths": "^4.2.1",
"vitest": "^0.34.6"
},
"engines": {
"node": ">=16.8.0 <18.0.0 || >=18.11"
@@ -62,7 +62,7 @@
"qwik": "qwik",
"start": "vite --open --mode ssr",
"test.cluster": "tsm src/cluster.ts",
"test.unit": "tsm node_modules/uvu/bin.js src unit.ts --tsmconfig tsm.cjs",
"test.watch": "watchlist src unit.ts -- pnpm test.unit"
"test.unit": "vitest",
"test.watch": "vitest --watch"
}
}

9
packages/insights/src/stats/clustering.unit.ts
View File

@@ -1,6 +1,5 @@
import { test } from 'uvu';
import * as assert from 'uvu/assert';
import { DBSCAN } from 'density-clustering';
import { assert, test } from 'vitest';
test('dbscan', () => {
const dataset = [
@@ -19,12 +18,10 @@ test('dbscan', () => {
const dbscan = new DBSCAN();
const clusters = dbscan.run(dataset, 5, 2);
assert.equal(clusters, [
assert.deepEqual(clusters, [
[0, 1, 2],
[3, 4, 5],
[6, 7, 9],
]);
assert.equal(dbscan.noise, [8]);
assert.deepEqual(dbscan.noise, [8]);
});
test.run();

13
packages/insights/src/stats/edges.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import * as assert from 'uvu/assert';
import { assert, test } from 'vitest';
import {
type SymbolPairs,
type SymbolVectors,
@@ -11,7 +10,7 @@ test('simple paths', () => {
const graph = computeSymbolGraph([edge('->a'), edge('a->b'), edge('b->c'), edge('c->d')]);
const symbolVectors = computeSymbolVectors(graph);
const result = toResult(symbolVectors);
assert.equal(result, {
assert.deepEqual(result, {
// How to think about this table:
// 1. The top row is the FROM symbol.
// 2. The left column is the TO symbol.
@@ -39,7 +38,7 @@ test('diamond', () => {
]);
const symbolVectors = computeSymbolVectors(graph);
const result = toResult(symbolVectors);
assert.equal(result, {
assert.deepEqual(result, {
// How to think about this table:
// 1. The top row is the FROM symbol.
// 2. The left column is the TO symbol.
@@ -70,7 +69,7 @@ test('lopsided diamond', () => {
]);
const symbolVectors = computeSymbolVectors(graph);
const result = toResult(symbolVectors);
assert.equal(result, {
assert.deepEqual(result, {
// How to think about this table:
// 1. The top row is the FROM symbol.
// 2. The left column is the TO symbol.
@@ -97,7 +96,7 @@ test('incomplete diamond', () => {
]);
const symbolVectors = computeSymbolVectors(graph);
const result = toResult(symbolVectors);
assert.equal(result, {
assert.deepEqual(result, {
// How to think about this table:
// 1. The top row is the FROM symbol.
// 2. The left column is the TO symbol.
@@ -133,5 +132,3 @@ function toResult(symbolVectors: SymbolVectors): Record<string, number[]> {
}
return result;
}
test.run();

73
packages/insights/src/stats/vector.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import * as assert from 'uvu/assert';
import { assert, test } from 'vitest';
import {
MAX_VALUE,
NUMBER_OF_BUCKETS,
@@ -9,7 +8,7 @@ import {
toBucketTimeline,
} from './vector';
test.only('bucketize values', () => {
test('bucketize values', () => {
// let previousBucket = -1;
// let value = 0;
// while (previousBucket < NUMBER_OF_BUCKETS - 1) {
@@ -20,29 +19,29 @@ test.only('bucketize values', () => {
// }
// value++;
// }
assert.is(toBucket(0), 0);
assert.is(toBucket(1), 1);
assert.is(toBucket(2), 2);
assert.is(toBucket(3), 3);
assert.is(toBucket(4), 4);
assert.is(toBucket(5), 4);
assert.is(toBucket(6), 5);
assert.is(toBucket(7), 5);
assert.is(toBucket(8), 6);
assert.is(toBucket(9), 6);
assert.is(toBucket(10), 7);
assert.is(toBucket(MAX_VALUE), NUMBER_OF_BUCKETS - 1);
assert.is(toBucket(Number.MAX_SAFE_INTEGER), NUMBER_OF_BUCKETS - 1);
assert.is(toBucket(MAX_VALUE - 1), NUMBER_OF_BUCKETS - 2);
assert.equal(toBucket(0), 0);
assert.equal(toBucket(1), 1);
assert.equal(toBucket(2), 2);
assert.equal(toBucket(3), 3);
assert.equal(toBucket(4), 4);
assert.equal(toBucket(5), 4);
assert.equal(toBucket(6), 5);
assert.equal(toBucket(7), 5);
assert.equal(toBucket(8), 6);
assert.equal(toBucket(9), 6);
assert.equal(toBucket(10), 7);
assert.equal(toBucket(MAX_VALUE), NUMBER_OF_BUCKETS - 1);
assert.equal(toBucket(Number.MAX_SAFE_INTEGER), NUMBER_OF_BUCKETS - 1);
assert.equal(toBucket(MAX_VALUE - 1), NUMBER_OF_BUCKETS - 2);
});
test.only('debucketize', () => {
assert.equal(fromBucket(0), { min: 0, max: 1, avg: 0.5 });
assert.equal(fromBucket(1), { min: 1, max: 2, avg: 1.5 });
assert.equal(fromBucket(NUMBER_OF_BUCKETS - 1).min, MAX_VALUE);
test('debucketize', () => {
assert.deepEqual(fromBucket(0), { min: 0, max: 1, avg: 0.5 });
assert.deepEqual(fromBucket(1), { min: 1, max: 2, avg: 1.5 });
assert.deepEqual(fromBucket(NUMBER_OF_BUCKETS - 1).min, MAX_VALUE);
});
test.only('bucketize timeline values', () => {
test('bucketize timeline values', () => {
// let previousBucket = -1;
// let value = 0;
// while (previousBucket < NUMBER_OF_BUCKETS - 1) {
@@ -53,20 +52,18 @@ test.only('bucketize timeline values', () => {
// }
// value++;
// }
assert.is(toBucketTimeline(0), 0);
assert.is(toBucketTimeline(70), 1);
assert.is(toBucketTimeline(233), 2);
assert.is(toBucketTimeline(425), 3);
assert.is(toBucketTimeline(640), 4);
assert.is(toBucketTimeline(800), 4);
assert.is(toBucketTimeline(900), 5);
assert.is(toBucketTimeline(950), 5);
assert.is(toBucketTimeline(1200), 6);
assert.is(toBucketTimeline(1400), 6);
assert.is(toBucketTimeline(1800), 7);
assert.is(toBucketTimeline(TIMELINE_MAX_VALUE), NUMBER_OF_BUCKETS - 1);
assert.is(toBucketTimeline(Number.MAX_SAFE_INTEGER), NUMBER_OF_BUCKETS - 1);
assert.is(toBucketTimeline(TIMELINE_MAX_VALUE - 1), NUMBER_OF_BUCKETS - 2);
assert.equal(toBucketTimeline(0), 0);
assert.equal(toBucketTimeline(70), 1);
assert.equal(toBucketTimeline(233), 2);
assert.equal(toBucketTimeline(425), 3);
assert.equal(toBucketTimeline(640), 4);
assert.equal(toBucketTimeline(800), 4);
assert.equal(toBucketTimeline(900), 5);
assert.equal(toBucketTimeline(950), 5);
assert.equal(toBucketTimeline(1200), 6);
assert.equal(toBucketTimeline(1400), 6);
assert.equal(toBucketTimeline(1800), 7);
assert.equal(toBucketTimeline(TIMELINE_MAX_VALUE), NUMBER_OF_BUCKETS - 1);
assert.equal(toBucketTimeline(Number.MAX_SAFE_INTEGER), NUMBER_OF_BUCKETS - 1);
assert.equal(toBucketTimeline(TIMELINE_MAX_VALUE - 1), NUMBER_OF_BUCKETS - 2);
});
test.run();

23
packages/insights/src/test.unit.ts
View File

@@ -1,23 +0,0 @@
// tests/demo.js
import { test } from 'uvu';
import * as assert from 'uvu/assert';
test('Math.sqrt()', () => {
assert.is(Math.sqrt(4), 2);
assert.is(Math.sqrt(144), 12);
assert.is(Math.sqrt(2), Math.SQRT2);
});
test('JSON', () => {
const input = {
foo: 'hello',
bar: 'world',
};
const output = JSON.stringify(input);
assert.snapshot(output, `{"foo":"hello","bar":"world"}`);
assert.equal(JSON.parse(output), input, 'matches original');
});
test.run();

2
packages/insights/tsconfig.json
View File

@@ -21,6 +21,6 @@
"~/*": ["./src/*"]
}
},
"files": ["./.eslintrc.cjs"],
"files": ["./.eslintrc.cjs", "vitest.config.ts"],
"include": ["src", "./*.d.ts"]
}

10
packages/insights/vitest.config.ts Normal file
View File

@@ -0,0 +1,10 @@
import { defineConfig } from 'vitest/config';
import tsconfigPaths from 'vite-tsconfig-paths';
export default defineConfig({
plugins: [tsconfigPaths({ ignoreConfigErrors: true })],
test: {
include: ['**/*.unit.?(c|m)[jt]s?(x)'],
setupFiles: ['../../vitest-setup.ts'],
},
});

2
packages/qwik-auth/package.json
View File

@@ -7,7 +7,7 @@
"@auth/core": "^0.13.0",
"@builder.io/qwik": "workspace:*",
"@builder.io/qwik-city": "workspace:*",
"@types/set-cookie-parser": "^2.4.3",
"@types/set-cookie-parser": "^2.4.4",
"set-cookie-parser": "^2.6.0"
},
"engines": {

4
packages/qwik-city/adapters/shared/api.md
View File

@@ -22,10 +22,10 @@ export function getParentDir(startDir: string, dirName: string): string;
export const NOT_FOUND_PATHS_ID = "@qwik-city-not-found-paths";
// @public (undocumented)
export const RESOLVED_NOT_FOUND_PATHS_ID: string;
export const RESOLVED_NOT_FOUND_PATHS_ID = "@qwik-city-not-found-paths.js";
// @public (undocumented)
export const RESOLVED_STATIC_PATHS_ID: string;
export const RESOLVED_STATIC_PATHS_ID = "@qwik-city-static-paths.js";
// @public (undocumented)
export interface ServerAdapterOptions {

2
packages/qwik-city/buildtime/build-endpoints.unit.ts
View File

@@ -18,5 +18,3 @@ test('endpoint w/ params', ({ assertRoute }) => {
equal(r.paramNames[0], 'org');
equal(r.paramNames[1], 'user');
});
test.run();

17
packages/qwik-city/buildtime/build-layout.unit.ts
View File

@@ -1,22 +1,19 @@
import { equal } from 'uvu/assert';
import { testAppSuite } from '../utils/test-suite';
import { assert, testAppSuite } from '../utils/test-suite';
const test = testAppSuite('Build Layout');
test('total layouts', ({ layouts }) => {
equal(layouts.length, 10, JSON.stringify(layouts, null, 2));
test('total layouts', ({ ctx: { layouts } }) => {
assert.equal(layouts.length, 10, JSON.stringify(layouts, null, 2));
});
test('nested named layout', ({ assertLayout }) => {
const l = assertLayout('CommonApiLayoutapi');
equal(l.layoutType, 'nested');
equal(l.layoutName, 'api');
assert.equal(l.layoutType, 'nested');
assert.equal(l.layoutName, 'api');
});
test('nested layout', ({ assertLayout }) => {
const l = assertLayout('CommonAuthLayout');
equal(l.layoutType, 'nested');
equal(l.layoutName, '');
assert.equal(l.layoutType, 'nested');
assert.equal(l.layoutName, '');
});
test.run();

6
packages/qwik-city/buildtime/build-menus.unit.ts
View File

@@ -3,14 +3,12 @@ import { testAppSuite } from '../utils/test-suite';
const test = testAppSuite('Build Menu');
test('menus found', ({ menus }) => {
test('menus found', ({ ctx: { menus } }) => {
equal(menus.length, 1);
});
test('docs menu', ({ menus }) => {
test('docs menu', ({ ctx: { menus } }) => {
const docsMenu = menus.find((r) => r.pathname === '/docs/')!;
ok(docsMenu, 'found docs menu');
equal(docsMenu.pathname, '/docs/');
});
test.run();

20
packages/qwik-city/buildtime/build-pages-rewrited.unit.ts
View File

@@ -23,7 +23,7 @@ const test = testAppSuite('Build Pages Rewrited', {
],
});
test('translated pathname / with prefix', ({ assertRoute, opts }) => {
test('translated pathname / with prefix', ({ assertRoute }) => {
const r = assertRoute('/it/');
assert.equal(r.id, 'CommonRouteIT');
assert.equal(r.pathname, '/it/');
@@ -39,7 +39,7 @@ test('translated pathname / with prefix', ({ assertRoute, opts }) => {
assert.ok(r.filePath.endsWith('starters/apps/qwikcity-test/src/routes/(common)/index.tsx'));
});
test('translated pathname /docs/getting-started with prefix', ({ assertRoute, opts }) => {
test('translated pathname /docs/getting-started with prefix', ({ assertRoute }) => {
const r = assertRoute('/it/documentazione/per-iniziare/');
assert.equal(r.id, 'DocsGettingstartedRouteIT');
assert.equal(r.pathname, '/it/documentazione/per-iniziare/');
@@ -59,7 +59,7 @@ test('translated pathname /docs/getting-started with prefix', ({ assertRoute, op
);
});
test('translated pathname /docs/[category]/[id] with prefix', ({ assertRoute, opts }) => {
test('translated pathname /docs/[category]/[id] with prefix', ({ assertRoute }) => {
const r = assertRoute('/it/documentazione/[category]/[id]/');
assert.equal(r.id, 'DocsCategoryIdRouteIT');
assert.equal(r.pathname, '/it/documentazione/[category]/[id]/');
@@ -81,7 +81,7 @@ test('translated pathname /docs/[category]/[id] with prefix', ({ assertRoute, op
);
});
test('translated pathname /about-us with prefix', ({ assertRoute, opts }) => {
test('translated pathname /about-us with prefix', ({ assertRoute }) => {
const r = assertRoute('/it/informazioni/');
assert.equal(r.id, 'CommonAboutusRouteIT');
assert.equal(r.pathname, '/it/informazioni/');
@@ -100,7 +100,7 @@ test('translated pathname /about-us with prefix', ({ assertRoute, opts }) => {
);
});
test('translated pathname /products/[id] with prefix', ({ assertRoute, opts }) => {
test('translated pathname /products/[id] with prefix', ({ assertRoute }) => {
const r = assertRoute('/it/prodotti/[id]/');
assert.equal(r.id, 'CommonProductsIdRouteIT');
assert.equal(r.pathname, '/it/prodotti/[id]/');
@@ -120,7 +120,7 @@ test('translated pathname /products/[id] with prefix', ({ assertRoute, opts }) =
);
});
test('translated pathname /docs/getting-started', ({ assertRoute, opts }) => {
test('translated pathname /docs/getting-started', ({ assertRoute }) => {
const r = assertRoute('/documentazione/per-iniziare/');
assert.equal(r.id, 'DocsGettingstartedRoute0');
assert.equal(r.pathname, '/documentazione/per-iniziare/');
@@ -139,7 +139,7 @@ test('translated pathname /docs/getting-started', ({ assertRoute, opts }) => {
);
});
test('translated pathname /docs/[category]/[id]', ({ assertRoute, opts }) => {
test('translated pathname /docs/[category]/[id]', ({ assertRoute }) => {
const r = assertRoute('/documentazione/[category]/[id]/');
assert.equal(r.id, 'DocsCategoryIdRoute0');
assert.equal(r.pathname, '/documentazione/[category]/[id]/');
@@ -160,7 +160,7 @@ test('translated pathname /docs/[category]/[id]', ({ assertRoute, opts }) => {
);
});
test('translated pathname /about-us', ({ assertRoute, opts }) => {
test('translated pathname /about-us', ({ assertRoute }) => {
const r = assertRoute('/informazioni/');
assert.equal(r.id, 'CommonAboutusRoute0');
assert.equal(r.pathname, '/informazioni/');
@@ -178,7 +178,7 @@ test('translated pathname /about-us', ({ assertRoute, opts }) => {
);
});
test('translated pathname /products/[id]', ({ assertRoute, opts }) => {
test('translated pathname /products/[id]', ({ assertRoute }) => {
const r = assertRoute('/prodotti/[id]/');
assert.equal(r.id, 'CommonProductsIdRoute0');
assert.equal(r.pathname, '/prodotti/[id]/');
@@ -196,5 +196,3 @@ test('translated pathname /products/[id]', ({ assertRoute, opts }) => {
r.filePath.endsWith('starters/apps/qwikcity-test/src/routes/(common)/products/[id]/index.tsx')
);
});
test.run();

30
packages/qwik-city/buildtime/build-pages.unit.ts
View File

@@ -1,4 +1,4 @@
import * as assert from 'uvu/assert';
import { assert } from 'vitest';
import { testAppSuite } from '../utils/test-suite';
const test = testAppSuite('Build Pages');
@@ -6,7 +6,7 @@ const test = testAppSuite('Build Pages');
test('layoutStop file', ({ assertRoute }) => {
const r = assertRoute('/mit/');
assert.equal(r.id, 'CommonMitRoute');
assert.equal(r.pattern, /^\/mit\/?$/);
assert.deepEqual(r.pattern, /^\/mit\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts.length, 0);
});
@@ -14,7 +14,7 @@ test('layoutStop file', ({ assertRoute }) => {
test('pathless directory', ({ assertRoute }) => {
const r = assertRoute('/sign-in/');
assert.equal(r.id, 'CommonAuthSigninRoute');
assert.equal(r.pattern, /^\/sign-in\/?$/);
assert.deepEqual(r.pattern, /^\/sign-in\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts.length, 3);
assert.equal(r.layouts[0].id, 'Layout');
@@ -27,7 +27,7 @@ test('index file w/ nested named layout, in directory w/ nested named layout', (
}) => {
const r = assertRoute('/api/');
assert.equal(r.id, 'CommonApiIndexapiRoute');
assert.equal(r.pattern, /^\/api\/?$/);
assert.deepEqual(r.pattern, /^\/api\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts[0].id, 'Layout');
assert.equal(r.layouts[0].layoutName, '');
@@ -41,7 +41,7 @@ test('index file w/ nested named layout, in directory w/ nested named layout', (
test('index file w/out named layout, in directory w/ named layout', ({ assertRoute }) => {
const r = assertRoute('/dashboard/');
assert.equal(r.id, 'DashboardRoute');
assert.equal(r.pattern, /^\/dashboard\/?$/);
assert.deepEqual(r.pattern, /^\/dashboard\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts[0].id, 'Layout');
assert.equal(r.layouts[0].layoutType, 'nested');
@@ -51,7 +51,7 @@ test('index file w/out named layout, in directory w/ named layout', ({ assertRou
test('index file in directory w/ nested named layout file', ({ assertRoute }) => {
const r = assertRoute('/dashboard/profile/');
assert.equal(r.id, 'DashboardProfileRoute');
assert.equal(r.pattern, /^\/dashboard\/profile\/?$/);
assert.deepEqual(r.pattern, /^\/dashboard\/profile\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts[0].id, 'Layout');
assert.equal(r.layouts[0].layoutType, 'nested');
@@ -61,7 +61,7 @@ test('index file in directory w/ nested named layout file', ({ assertRoute }) =>
test('index file in directory w/ top named layout file', ({ assertRoute }) => {
const r = assertRoute('/dashboard/settings/');
assert.equal(r.id, 'DashboardSettingsRoute');
assert.equal(r.pattern, /^\/dashboard\/settings\/?$/);
assert.deepEqual(r.pattern, /^\/dashboard\/settings\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts[0].id, 'Layout');
assert.equal(r.layouts[0].layoutType, 'nested');
@@ -73,7 +73,7 @@ test('params route, index file w/out named layout, in directory w/ top layout di
}) => {
const r = assertRoute('/docs/[category]/[id]/');
assert.equal(r.id, 'DocsCategoryIdRoute');
assert.equal(r.pattern, /^\/docs\/([^/]+?)\/([^/]+?)\/?$/);
assert.deepEqual(r.pattern, /^\/docs\/([^/]+?)\/([^/]+?)\/?$/);
assert.equal(r.paramNames.length, 2);
assert.equal(r.paramNames[0], 'category');
assert.equal(r.paramNames[1], 'id');
@@ -86,7 +86,7 @@ test('markdown index file w/out named layout, in directory w/ top layout directo
}) => {
const r = assertRoute('/docs/overview/');
assert.equal(r.id, 'DocsOverviewRoute');
assert.equal(r.pattern, /^\/docs\/overview\/?$/);
assert.deepEqual(r.pattern, /^\/docs\/overview\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts[0].id, 'Layout');
assert.equal(r.layouts.length, 2);
@@ -97,7 +97,7 @@ test('markdown file w/out named layout, in directory w/ top layout directory', (
}) => {
const r = assertRoute('/docs/getting-started/');
assert.equal(r.id, 'DocsGettingstartedRoute');
assert.equal(r.pattern, /^\/docs\/getting-started\/?$/);
assert.deepEqual(r.pattern, /^\/docs\/getting-started\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts[0].id, 'Layout');
assert.equal(r.layouts.length, 2);
@@ -106,7 +106,7 @@ test('markdown file w/out named layout, in directory w/ top layout directory', (
test('index file w/out named layout, in directory w/ top layout directory', ({ assertRoute }) => {
const r = assertRoute('/docs/');
assert.equal(r.id, 'DocsRoute');
assert.equal(r.pattern, /^\/docs\/?$/);
assert.deepEqual(r.pattern, /^\/docs\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts[0].id, 'Layout');
assert.equal(r.layouts[0].layoutName, '');
@@ -117,7 +117,7 @@ test('index file w/out named layout, in directory w/ top layout directory', ({ a
test('named file w/out named layout, in directory w/ layout directory', ({ assertRoute }) => {
const r = assertRoute('/about-us/');
assert.equal(r.id, 'CommonAboutusRoute');
assert.equal(r.pattern, /^\/about-us\/?$/);
assert.deepEqual(r.pattern, /^\/about-us\/?$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.layouts[0].id, 'Layout');
assert.equal(r.layouts[0].layoutType, 'nested');
@@ -127,16 +127,14 @@ test('named file w/out named layout, in directory w/ layout directory', ({ asser
test('named tsx file', ({ assertRoute }) => {
const r = assertRoute('/about-us/');
assert.equal(r.id, 'CommonAboutusRoute');
assert.equal(r.pattern, /^\/about-us\/?$/);
assert.deepEqual(r.pattern, /^\/about-us\/?$/);
assert.equal(r.paramNames.length, 0);
});
test('root index', ({ assertRoute }) => {
const r = assertRoute('/');
assert.equal(r.id, 'CommonRoute');
assert.equal(r.pattern, /^\/$/);
assert.deepEqual(r.pattern, /^\/$/);
assert.equal(r.paramNames.length, 0);
assert.equal(r.paramNames.length, 0);
});
test.run();

13
packages/qwik-city/buildtime/markdown/frontmatter.unit.ts
View File

@@ -1,7 +1,6 @@
import * as assert from 'uvu/assert';
import { test } from 'uvu';
import { frontmatterAttrsToDocumentHead, parseFrontmatterAttrs } from './frontmatter';
import type { FrontmatterAttrs } from '../types';
import { assert, test } from 'vitest';
test('frontmatter, one line', async () => {
const yaml = 'title: Some Title';
@@ -24,19 +23,19 @@ test('frontmatter, multiline string', async () => {
test('frontmatter, list', async () => {
const yaml = 'tags:' + '\n' + ' - tag1' + '\n' + ' - tag2';
const attrs: FrontmatterAttrs = parseFrontmatterAttrs(yaml);
assert.equal(attrs.tags, ['tag1', 'tag2']);
assert.deepEqual(attrs.tags, ['tag1', 'tag2']);
});
test('frontmatter, inline list', async () => {
const yaml = 'tags: [tag1, tag2]';
const attrs: FrontmatterAttrs = parseFrontmatterAttrs(yaml);
assert.equal(attrs.tags, ['tag1', 'tag2']);
assert.deepEqual(attrs.tags, ['tag1', 'tag2']);
});
test('frontmatter, dictionary', async () => {
const yaml = 'custom:' + '\n' + ' author: Me';
const attrs: FrontmatterAttrs = parseFrontmatterAttrs(yaml);
assert.equal(attrs.custom, { author: 'Me' });
assert.deepEqual(attrs.custom, { author: 'Me' });
});
test('frontmatter, multiple', async () => {
@@ -53,7 +52,7 @@ test('frontmatter, multiple', async () => {
const attrs: FrontmatterAttrs = parseFrontmatterAttrs(yaml);
assert.equal(attrs.title, 'Some Title');
assert.equal(attrs.description, 'Some Description');
assert.equal(attrs.contributors, ['abc', 'xyz']);
assert.deepEqual(attrs.contributors, ['abc', 'xyz']);
assert.equal(attrs['color-scheme'], 'dark');
});
@@ -174,5 +173,3 @@ test('frontmatter, opengraph custom property', async () => {
assert.equal(head!.meta[5].property, 'og:image:height');
assert.equal(head!.meta[5].content, '1000');
});
test.run();

7
packages/qwik-city/buildtime/markdown/markdown-url.unit.ts
View File

@@ -1,9 +1,8 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { getMarkdownRelativeUrl } from './markdown-url';
import type { NormalizedPluginOptions } from '../types';
import { tmpdir } from 'node:os';
import { join } from 'node:path';
import { assert, test } from 'vitest';
const routesDir = tmpdir();
const serverPluginsDir = tmpdir();
@@ -82,8 +81,6 @@ const menuFilePath = join(routesDir, 'docs', 'menu.md');
platform: {},
rewriteRoutes: [],
};
equal(getMarkdownRelativeUrl(opts, menuFilePath, t.href), t.expect);
assert.equal(getMarkdownRelativeUrl(opts, menuFilePath, t.href), t.expect);
});
});
test.run();

37
packages/qwik-city/buildtime/markdown/menu.unit.ts
View File

@@ -1,11 +1,10 @@
import { join } from 'node:path';
import * as assert from 'uvu/assert';
import { createMenu, parseMenu } from './menu';
import { suite } from '../../utils/test-suite';
import { suite, assert } from '../../utils/test-suite';
const test = suite();
test('parse menu.md menu', ({ opts }) => {
test('parse menu.md menu', ({ ctx: { opts } }) => {
const filePath = join(opts.routesDir, 'guide', 'menu.md');
const content = `
# Heading
@@ -24,26 +23,24 @@ test('parse menu.md menu', ({ opts }) => {
`;
const menu = createMenu(opts, filePath);
assert.is(menu.pathname, '/guide/');
assert.equal(menu.pathname, '/guide/');
const i = parseMenu(opts, filePath, content, false);
assert.is(i.text, 'Heading');
assert.equal(i.text, 'Heading');
assert.is(i.items![0].text, 'Section A');
assert.is(i.items![0].items?.length, 2);
assert.is(i.items![0].items![0].text, 'Text A1');
assert.is(i.items![0].items![1].text, 'Link A1');
assert.is(i.items![0].items![1].href, '/link-a1/');
assert.equal(i.items![0].text, 'Section A');
assert.equal(i.items![0].items?.length, 2);
assert.equal(i.items![0].items![0].text, 'Text A1');
assert.equal(i.items![0].items![1].text, 'Link A1');
assert.equal(i.items![0].items![1].href, '/link-a1/');
assert.is(i.items![1].text, 'Section B');
assert.is(i.items![1].items?.length, 2);
assert.is(i.items![1].items![0].text, 'Link B1');
assert.is(i.items![1].items![0].href, '/guide/link-b1/');
assert.is(i.items![1].items![1].text, 'Text B1');
assert.equal(i.items![1].text, 'Section B');
assert.equal(i.items![1].items?.length, 2);
assert.equal(i.items![1].items![0].text, 'Link B1');
assert.equal(i.items![1].items![0].href, '/guide/link-b1/');
assert.equal(i.items![1].items![1].text, 'Text B1');
assert.is(i.items![2].text, 'Section C');
assert.is(i.items![2].href, 'http://section-c.com');
assert.is(i.items![2].items, undefined);
assert.equal(i.items![2].text, 'Section C');
assert.equal(i.items![2].href, 'http://section-c.com');
assert.equal(i.items![2].items, undefined);
});
test.run();

9
packages/qwik-city/buildtime/routing/parse-pathname.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { parseRoutePathname } from './parse-pathname';
/**
@@ -79,9 +78,7 @@ const tests = {
for (const [key, t] of Object.entries(tests)) {
test(`parseRoutePathname: "${key}"`, () => {
const actual = parseRoutePathname(t.basePathname, key);
equal(actual.pattern.toString(), t.pattern.toString());
equal(actual.paramNames, t.paramNames);
assert.equal(actual.pattern.toString(), t.pattern.toString());
assert.deepEqual(actual.paramNames, t.paramNames);
});
}
test.run();

9
packages/qwik-city/buildtime/routing/resolve-source-file.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import type { NormalizedPluginOptions, RouteSourceFile } from '../types';
import { resolveLayout } from './resolve-source-file';
import { getSourceFile } from './source-file';
@@ -59,9 +58,7 @@ test('resolveLayout', () => {
fileName: '',
};
const l = resolveLayout(opts, sourceFile);
equal(l.layoutName, c.expect.layoutName, c.fileName);
equal(l.layoutType, c.expect.layoutType, c.fileName);
assert.equal(l.layoutName, c.expect.layoutName, c.fileName);
assert.equal(l.layoutType, c.expect.layoutType, c.fileName);
});
});
test.run();

11
packages/qwik-city/buildtime/routing/sort-routes.unit.ts
View File

@@ -1,9 +1,8 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import type { BuildRoute } from '../types';
import { createFileId } from '../../utils/fs';
import { parseRoutePathname } from './parse-pathname';
import { routeSortCompare } from './sort-routes';
import { test, assert } from 'vitest';
test('routeSortCompare', () => {
const pathnames = [
@@ -30,17 +29,17 @@ test('routeSortCompare', () => {
const routesSame = [...pathnames].map((p) => route({ pathname: p }));
const actualSame = routesSame.sort(routeSortCompare).map((r) => r.pathname);
equal(actualSame, pathnames);
assert.deepEqual(actualSame, pathnames);
const routesReversed = [...pathnames].reverse().map((p) => route({ pathname: p }));
const actualReversed = routesReversed.sort(routeSortCompare).map((r) => r.pathname);
equal(actualReversed, pathnames);
assert.deepEqual(actualReversed, pathnames);
const routesRandom = [...pathnames]
.sort(() => Math.random() - 0.5)
.map((p) => route({ pathname: p }));
const actualRandom = routesRandom.sort(routeSortCompare).map((r) => r.pathname);
equal(actualRandom, pathnames);
assert.deepEqual(actualRandom, pathnames);
});
function route(r: TestRoute) {
@@ -60,5 +59,3 @@ interface TestRoute {
paramNames?: string[];
pathname?: string;
}
test.run();

13
packages/qwik-city/buildtime/routing/source-file.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { getSourceFile } from './source-file';
[
@@ -211,13 +210,11 @@ import { getSourceFile } from './source-file';
test(`getSourceFile ${t.fileName}`, () => {
const s = getSourceFile(t.fileName);
if (s == null || t.expect == null) {
equal(s, t.expect, t.fileName);
assert.equal(s, t.expect, t.fileName);
} else {
equal(s.type, t.expect.type, t.fileName);
equal(s.extlessName, t.expect.extlessName, t.fileName);
equal(s.ext, t.expect.ext, t.fileName);
assert.equal(s.type, t.expect.type, t.fileName);
assert.equal(s.extlessName, t.expect.extlessName, t.fileName);
assert.equal(s.ext, t.expect.ext, t.fileName);
}
});
});
test.run();

13
packages/qwik-city/buildtime/runtime-generation/generate-service-worker.unit.ts
View File

@@ -1,13 +1,10 @@
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import type { BuildContext, BuildRoute } from '../types';
import type { QwikManifest, InsightManifest } from '@builder.io/qwik/optimizer';
import type { AppBundle } from '../../runtime/src/service-worker/types';
import { generateLinkBundles } from './generate-service-worker';
import { assert, test } from 'vitest';
const swSuite = suite('lint');
swSuite('incorporate qwik-insights', () => {
test('incorporate qwik-insights', () => {
const routes: BuildRoute[] = [
{
routeName: '/',
@@ -54,8 +51,6 @@ swSuite('incorporate qwik-insights', () => {
{ route: '/routeA', symbols: ['345'] },
];
const [_, routeToBundles] = generateLinkBundles(ctx, appBundles, manifest, prefetch);
equal(routeToBundles['/'], ['q-bundle-123.js', 'q-bundle-234.js', 'q-bundle-a.js']);
equal(routeToBundles['/routeA'], ['q-bundle-345.js', 'q-bundle-b.js']);
assert.deepEqual(routeToBundles['/'], ['q-bundle-123.js', 'q-bundle-234.js', 'q-bundle-a.js']);
assert.deepEqual(routeToBundles['/routeA'], ['q-bundle-345.js', 'q-bundle-b.js']);
});
swSuite.run();

7
packages/qwik-city/middleware/node/http.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { normalizeUrl } from './http';
[
@@ -30,8 +29,6 @@ import { normalizeUrl } from './http';
},
].forEach((t) => {
test(`normalizeUrl(${t.url}, ${t.base})`, () => {
equal(normalizeUrl(t.url, t.base).href, t.expect);
assert.equal(normalizeUrl(t.url, t.base).href, t.expect);
});
});
test.run();

23
packages/qwik-city/middleware/request-handler/cookie.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { Cookie } from './cookie';
import type { CookieOptions } from './types';
@@ -24,16 +23,16 @@ test('parses cookie', () => {
.join(';');
const cookie = new Cookie(cookieString);
Object.keys(cookieValues).forEach((key) => {
equal(true, cookie.has(key));
assert.equal(true, cookie.has(key));
});
Object.entries(cookieValues).forEach(([key, value]) => {
equal(cookie.get(key)?.value, value);
assert.equal(cookie.get(key)?.value, value);
});
equal(Object.keys(cookie.getAll()).length, 4);
equal(cookie.getAll().a.value, 'hello=world');
equal(cookie.getAll().b.number(), 25);
equal(cookie.getAll().c.json(), { hello: 'world' });
equal(cookie.getAll().d.value, '%badencoding');
assert.equal(Object.keys(cookie.getAll()).length, 4);
assert.equal(cookie.getAll().a.value, 'hello=world');
assert.equal(cookie.getAll().b.number(), 25);
assert.deepEqual(cookie.getAll().c.json(), { hello: 'world' });
assert.equal(cookie.getAll().d.value, '%badencoding');
});
test('creates correct headers', () => {
@@ -90,12 +89,10 @@ test('creates correct headers', () => {
});
const result = cookie.headers();
equal(expect.length, result.length);
assert.equal(expect.length, result.length);
for (let i = 0; i < expect.length; i++) {
const expected = expect[i];
const actual = result[i];
equal(actual, expected);
assert.equal(actual, expected);
}
});
test.run();

26
packages/qwik-city/package.json
View File

@@ -5,23 +5,23 @@
"bugs": "https://github.com/BuilderIO/qwik/issues",
"dependencies": {
"@mdx-js/mdx": "2.3.0",
"@types/mdx": "2.0.5",
"@types/mdx": "^2.0.8",
"source-map": "0.7.4",
"svgo": "^3.0.2",
"vfile": "^6.0.1",
"vite-imagetools": "^5.0.5",
"zod": "^3.21.4"
"vite-imagetools": "^5.0.9",
"zod": "^3.22.4"
},
"devDependencies": {
"@azure/functions": "^3.5.1",
"@builder.io/qwik": "workspace:*",
"@microsoft/api-extractor": "7.36.3",
"@netlify/edge-functions": "^2.0.0",
"@microsoft/api-extractor": "^7.38.0",
"@netlify/edge-functions": "^2.2.0",
"@types/marked": "5.0.1",
"@types/mdast": "^4.0.0",
"@types/node": "^20.4.5",
"@types/refractor": "3.0.2",
"@types/set-cookie-parser": "^2.4.3",
"@types/mdast": "^4.0.1",
"@types/node": "^20.8.4",
"@types/refractor": "^3.0.3",
"@types/set-cookie-parser": "^2.4.4",
"estree-util-value-to-estree": "3.0.1",
"github-slugger": "2.0.0",
"hast-util-heading-rank": "2.1.1",
@@ -34,13 +34,13 @@
"remark-frontmatter": "4.0.1",
"remark-gfm": "3.0.1",
"set-cookie-parser": "^2.6.0",
"tsm": "2.2.2",
"typescript": "5.1.6",
"tsm": "^2.3.0",
"typescript": "^5.2.2",
"unified": "10.1.2",
"unist-util-visit": "5.0.0",
"uvu": "0.5.6",
"vite": "4.4.7",
"yaml": "2.3.1"
"vite": "^4.4.11",
"yaml": "^2.3.2"
},
"engines": {
"node": ">=16.8.0 <18.0.0 || >=18.11"

50
packages/qwik-city/runtime/src/client-navigate.unit.ts
View File

@@ -1,65 +1,61 @@
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { clientNavigate, newScrollState } from './client-navigate';
import { deepEqual } from 'assert';
const navTest = suite('clientNavigate');
navTest('initialize and push empty scroll history state on navigate', () => {
test('initialize and push empty scroll history state on navigate', () => {
const [win, urlOf] = createTestWindow('http://qwik.dev/');
equal(win.history.state, null);
assert.equal(win.history.state, null);
const scrollState = newScrollState();
clientNavigate(win, 'link', urlOf('/'), urlOf('/page-a'));
deepEqual(win.history.state, { _qCityScroll: scrollState });
assert.deepEqual(win.history.state, { _qCityScroll: scrollState });
clientNavigate(win, 'link', urlOf('/page-a'), urlOf('/page-b'));
deepEqual(win.history.state, { _qCityScroll: scrollState });
assert.deepEqual(win.history.state, { _qCityScroll: scrollState });
win.history.popState(-1);
clientNavigate(win, 'popstate', urlOf('/page-b'), urlOf('/page-a'));
deepEqual(win.history.state, { _qCityScroll: scrollState });
assert.deepEqual(win.history.state, { _qCityScroll: scrollState });
win.history.popState(-1);
clientNavigate(win, 'popstate', urlOf('/page-a'), urlOf('/'));
// This will be null, upgrading state only happens in QwikCityProvider.
// ClientNavigate only pushes new empty states for the scroll handler to use.
equal(win.history.state, null);
assert.equal(win.history.state, null);
equal(win.events(), []);
assert.deepEqual(win.events(), []);
});
navTest('pushState for different routes', () => {
test('pushState for different routes', () => {
const [win, urlOf] = createTestWindow('http://qwik.dev/page-a?search=123');
equal(win.history.state, null);
assert.equal(win.history.state, null);
const scrollState = newScrollState();
clientNavigate(win, 'link', urlOf('/page-a?search=123'), urlOf('/page-b?search=123'));
deepEqual(win.history.state, { _qCityScroll: scrollState });
assert.deepEqual(win.history.state, { _qCityScroll: scrollState });
clientNavigate(win, 'link', urlOf('/page-b?search=123'), urlOf('/page-b?param=456'));
deepEqual(win.history.state, { _qCityScroll: scrollState });
assert.deepEqual(win.history.state, { _qCityScroll: scrollState });
equal(win.events(), []);
assert.deepEqual(win.events(), []);
});
navTest('when passing replaceState', () => {
test('when passing replaceState', () => {
const [win, urlOf] = createTestWindow('http://qwik.dev/page-a?search=123');
equal(win.history.state, null);
assert.equal(win.history.state, null);
const scrollState = newScrollState();
const length = win.history.length;
clientNavigate(win, 'link', urlOf('/page-a?search=123'), urlOf('/page-a?search=456'), true);
deepEqual(win.history.state, { _qCityScroll: scrollState });
equal(win.history.length, length);
assert.deepEqual(win.history.state, { _qCityScroll: scrollState });
assert.equal(win.history.length, length);
});
navTest('pushState for different hash', () => {
test('pushState for different hash', () => {
const [win, urlOf] = createTestWindow('http://qwik.dev/page-a?search=123#hash-1');
equal(win.history.state, null);
assert.equal(win.history.state, null);
const scrollState = newScrollState();
@@ -69,8 +65,8 @@ navTest('pushState for different hash', () => {
urlOf('/page-a?search=123#hash-1'),
urlOf('/page-b?search=123#hash-2')
);
deepEqual(win.history.state, { _qCityScroll: scrollState });
equal(win.events(), []);
assert.deepEqual(win.history.state, { _qCityScroll: scrollState });
assert.deepEqual(win.events(), []);
clientNavigate(
win,
@@ -78,7 +74,7 @@ navTest('pushState for different hash', () => {
urlOf('/page-b?search=123#hash-2'),
urlOf('/page-b?search=123#hash-3')
);
deepEqual(win.history.state, { _qCityScroll: scrollState });
assert.deepEqual(win.history.state, { _qCityScroll: scrollState });
});
function createTestWindow<T>(href: string): [testWindow: TestWindow, urlOf: (path: string) => URL] {
@@ -139,5 +135,3 @@ interface TestWindow extends Window {
events: () => Event[];
history: History & { popState: (delta: number) => void };
}
navTest.run();

335
packages/qwik-city/runtime/src/route-matcher.unit.ts
View File

@@ -1,180 +1,193 @@
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, describe, test } from 'vitest';
import { matchRoute } from './route-matcher';
const routeMatchSuite = suite('routeMatcher');
routeMatchSuite('should match /', () => {
equal(matchRoute('/', '/'), {});
equal(matchRoute('/', '/extra'), null, 'should not match extra');
});
routeMatchSuite('should match /foo/', () => {
equal(matchRoute('/foo', '/foo/'), {});
equal(matchRoute('foo', '/foo/'), {});
equal(matchRoute('/foo', '/foo/extra'), null, 'should not match extra');
});
routeMatchSuite('should match /foo/ with trailing slash', () => {
equal(matchRoute('/foo/', '/foo/'), {});
equal(matchRoute('/foo/', '/foo'), {});
equal(matchRoute('foo/', '/foo/'), {});
equal(matchRoute('/foo/', '/foo/extra'), null, 'should not match extra');
});
routeMatchSuite('should match /seg/[slug]/', () => {
equal(matchRoute('/seg/[slug]', '/seg/extract-text/'), { slug: 'extract-text' });
equal(matchRoute('/seg/[slug]', '/seg/[slug]/extra'), null, 'should not match extra');
});
routeMatchSuite('should match /seg/[slug]/ with trailing slash', () => {
equal(matchRoute('/seg/[slug]/', '/seg/extract-text/'), { slug: 'extract-text' });
equal(matchRoute('/seg/[slug]/', '/seg/[slug]/extra'), null, 'should not match extra');
});
routeMatchSuite('should match /seg/[slug]/[param]/', () => {
equal(matchRoute('/seg/[slug]/[param]', '/seg/extract-text/param-text/'), {
slug: 'extract-text',
param: 'param-text',
describe('route-matcher', () => {
test('should match /', () => {
assert.deepEqual(matchRoute('/', '/'), {});
assert.deepEqual(matchRoute('/', '/extra'), null, 'should not match extra');
});
equal(matchRoute('/seg/[slug]/[param]', '/seg/slug/param/extra'), null, 'should not match extra');
});
routeMatchSuite('should match /seg/[slug]/[param]/ with trailing slash', () => {
equal(matchRoute('/seg/[slug]/[param]/', '/seg/extract-text/param-text/'), {
slug: 'extract-text',
param: 'param-text',
test('should match /foo/', () => {
assert.deepEqual(matchRoute('/foo', '/foo/'), {});
assert.deepEqual(matchRoute('foo', '/foo/'), {});
assert.deepEqual(matchRoute('/foo', '/foo/extra'), null, 'should not match extra');
});
equal(
matchRoute('/seg/[slug]/[param]/', '/seg/slug/param/extra'),
null,
'should not match extra'
);
});
routeMatchSuite('should match /seg/[...rest]', () => {
equal(matchRoute('/seg/[...rest]', '/seg/a/b/c'), { rest: 'a/b/c' });
});
routeMatchSuite('should match /seg/[...rest] with trailing slash', () => {
equal(matchRoute('/seg/[...rest]/', '/seg/a/b/c'), { rest: 'a/b/c' });
});
routeMatchSuite('should match /stuff/[...param]', () => {
equal(matchRoute('/stuff/[...param]', '/stuff/'), { param: '' }, '1');
equal(matchRoute('/stuff/[...param]', '/stuff'), { param: '' }, '2');
});
routeMatchSuite('should match /stuff/[...param] with trailing slash', () => {
equal(matchRoute('/stuff/[...param]/', '/stuff/'), { param: '' }, '1');
equal(matchRoute('/stuff/[...param]/', '/stuff'), { param: '' }, '2');
});
routeMatchSuite('should match /seg/[paramA]/[...rest]', () => {
equal(matchRoute('/seg/[paramA]/[...rest]', '/seg/a/b/c'), { paramA: 'a', rest: 'b/c' });
});
routeMatchSuite('should match /seg/[paramA]/[...rest] with trailing slash', () => {
equal(matchRoute('/seg/[paramA]/[...rest]/', '/seg/a/b/c'), { paramA: 'a', rest: 'b/c' });
});
routeMatchSuite('regressions', () => {
equal(matchRoute('qwikcity-test/api/data.json', '/qwikcity-test/blog/'), null);
equal(matchRoute('/api/[org]/[user].json', '/api/builder.io/oss.json'), {
org: 'builder.io',
user: 'oss',
test('should match /foo/ with trailing slash', () => {
assert.deepEqual(matchRoute('/foo/', '/foo/'), {});
assert.deepEqual(matchRoute('/foo/', '/foo'), {});
assert.deepEqual(matchRoute('foo/', '/foo/'), {});
assert.deepEqual(matchRoute('/foo/', '/foo/extra'), null, 'should not match extra');
});
equal(matchRoute('/api/[org]/[user].json', '/api/builder.io/oss.json/'), {
org: 'builder.io',
user: 'oss',
test('should match /seg/[slug]/', () => {
assert.deepEqual(matchRoute('/seg/[slug]', '/seg/extract-text/'), { slug: 'extract-text' });
assert.deepEqual(
matchRoute('/seg/[slug]', '/seg/[slug]/extra'),
null,
'should not match extra'
);
});
test('should match /seg/[slug]/ with trailing slash', () => {
assert.deepEqual(matchRoute('/seg/[slug]/', '/seg/extract-text/'), { slug: 'extract-text' });
assert.deepEqual(
matchRoute('/seg/[slug]/', '/seg/[slug]/extra'),
null,
'should not match extra'
);
});
test('should match /seg/[slug]/[param]/', () => {
assert.deepEqual(matchRoute('/seg/[slug]/[param]', '/seg/extract-text/param-text/'), {
slug: 'extract-text',
param: 'param-text',
});
assert.deepEqual(
matchRoute('/seg/[slug]/[param]', '/seg/slug/param/extra'),
null,
'should not match extra'
);
});
test('should match /seg/[slug]/[param]/ with trailing slash', () => {
assert.deepEqual(matchRoute('/seg/[slug]/[param]/', '/seg/extract-text/param-text/'), {
slug: 'extract-text',
param: 'param-text',
});
assert.deepEqual(
matchRoute('/seg/[slug]/[param]/', '/seg/slug/param/extra'),
null,
'should not match extra'
);
});
test('should match /seg/[...rest]', () => {
assert.deepEqual(matchRoute('/seg/[...rest]', '/seg/a/b/c'), { rest: 'a/b/c' });
});
test('should match /seg/[...rest] with trailing slash', () => {
assert.deepEqual(matchRoute('/seg/[...rest]/', '/seg/a/b/c'), { rest: 'a/b/c' });
});
test('should match /stuff/[...param]', () => {
assert.deepEqual(matchRoute('/stuff/[...param]', '/stuff/'), { param: '' }, '1');
assert.deepEqual(matchRoute('/stuff/[...param]', '/stuff'), { param: '' }, '2');
});
test('should match /stuff/[...param] with trailing slash', () => {
assert.deepEqual(matchRoute('/stuff/[...param]/', '/stuff/'), { param: '' }, '1');
assert.deepEqual(matchRoute('/stuff/[...param]/', '/stuff'), { param: '' }, '2');
});
test('should match /seg/[paramA]/[...rest]', () => {
assert.deepEqual(matchRoute('/seg/[paramA]/[...rest]', '/seg/a/b/c'), {
paramA: 'a',
rest: 'b/c',
});
});
test('should match /seg/[paramA]/[...rest] with trailing slash', () => {
assert.deepEqual(matchRoute('/seg/[paramA]/[...rest]/', '/seg/a/b/c'), {
paramA: 'a',
rest: 'b/c',
});
});
test('regressions', () => {
assert.deepEqual(matchRoute('qwikcity-test/api/data.json', '/qwikcity-test/blog/'), null);
assert.deepEqual(matchRoute('/api/[org]/[user].json', '/api/builder.io/oss.json'), {
org: 'builder.io',
user: 'oss',
});
assert.deepEqual(matchRoute('/api/[org]/[user].json', '/api/builder.io/oss.json/'), {
org: 'builder.io',
user: 'oss',
});
});
test('regressions matching missing segment', () => {
assert.deepEqual(matchRoute('/[country]/[city]', '/other'), null, '00');
assert.deepEqual(matchRoute('/[country]/[city]', '/other/'), null, '01');
});
test('/a/pre[infix]post', () => {
assert.deepEqual(matchRoute('/a/pre[infix]post', '/a/preINpost'), {
infix: 'IN',
});
assert.deepEqual(matchRoute('/a/pre[infix]post', '/a/prepost'), {
infix: '',
});
});
test('should match /a/pre[infix]post with trailing slash', () => {
assert.deepEqual(matchRoute('/a/pre[infix]post/', '/a/preINpost'), {
infix: 'IN',
});
assert.deepEqual(matchRoute('/a/pre[infix]post/', '/a/prepost'), {
infix: '',
});
});
test('/[...rest] ignore trailing slash', () => {
assert.deepEqual(matchRoute('/[...rest]', '/a/b/c/'), {
rest: 'a/b/c',
});
assert.deepEqual(matchRoute('/[...rest]/', '/a/b/c/'), {
rest: 'a/b/c',
});
});
});
routeMatchSuite('regressions matching missing segment', () => {
equal(matchRoute('/[country]/[city]', '/other'), null, '00');
equal(matchRoute('/[country]/[city]', '/other/'), null, '01');
});
routeMatchSuite('/a/pre[infix]post', () => {
equal(matchRoute('/a/pre[infix]post', '/a/preINpost'), {
infix: 'IN',
describe('routeMatcher/#2951', () => {
test('/[...rest]', () => {
assert.deepEqual(matchRoute('/[...rest]', '/'), { rest: '' });
});
equal(matchRoute('/a/pre[infix]post', '/a/prepost'), {
infix: '',
test('/[...rest]/path', () => {
assert.deepEqual(matchRoute('/[...rest]/path', '/path'), { rest: '' });
});
test('[...rest]/path', () => {
assert.deepEqual(matchRoute('[...rest]/path', '/path'), { rest: '' });
});
test('/[...rest]/path', () => {
assert.deepEqual(matchRoute('/[...rest]/path', '/a/b/c/path'), { rest: 'a/b/c' });
});
test('[...rest]/path', () => {
assert.deepEqual(matchRoute('[...rest]/path', 'a/b/c/path'), { rest: 'a/b/c' });
});
test('/[...any]_suffix/path', () => {
assert.deepEqual(matchRoute('/[...rest]_suffix/path', '/a/b/c_suffix/path'), { rest: 'a/b/c' });
});
test('/[...a]/[...b]/path', () => {
assert.deepEqual(matchRoute('/[...a]/[...b]/path', '/a/b/c/path'), { a: 'a/b/c', b: '' });
});
});
routeMatchSuite('should match /a/pre[infix]post with trailing slash', () => {
equal(matchRoute('/a/pre[infix]post/', '/a/preINpost'), {
infix: 'IN',
});
equal(matchRoute('/a/pre[infix]post/', '/a/prepost'), {
infix: '',
describe('routeMatcher/#5080', () => {
test('/[...rest]/suffix', () => {
assert.deepEqual(matchRoute('/[...rest]/', '/a/b/c/suffix/'), { rest: 'a/b/c/suffix' });
assert.deepEqual(matchRoute('/[...rest]/suffix', '/a/b/c/suffix'), { rest: 'a/b/c' });
assert.deepEqual(matchRoute('/[...rest]/suffix', '/a/b/c/suffix/'), { rest: 'a/b/c' });
});
});
routeMatchSuite('/[...rest] ignore trailing slash', () => {
equal(matchRoute('/[...rest]', '/a/b/c/'), {
rest: 'a/b/c',
});
equal(matchRoute('/[...rest]/', '/a/b/c/'), {
rest: 'a/b/c',
describe('routeMatcher/#5126', () => {
test('/[...dynamicOne]/static-segment/[...dynamicTwo]/', () => {
assert.deepEqual(
matchRoute(
'/[...dynamicOne]/static-segment/[...dynamicTwo]/',
'/abc/xyz/static-segment/more-dynamic-123/'
),
{
dynamicOne: 'abc/xyz',
dynamicTwo: 'more-dynamic-123',
}
);
});
});
routeMatchSuite.run();
const regression2951 = suite('routeMatcher/#2951');
regression2951('/[...rest]', () => {
equal(matchRoute('/[...rest]', '/'), { rest: '' });
});
regression2951('/[...rest]/path', () => {
equal(matchRoute('/[...rest]/path', '/path'), { rest: '' });
});
regression2951('[...rest]/path', () => {
equal(matchRoute('[...rest]/path', '/path'), { rest: '' });
});
regression2951('/[...rest]/path', () => {
equal(matchRoute('/[...rest]/path', '/a/b/c/path'), { rest: 'a/b/c' });
});
regression2951('[...rest]/path', () => {
equal(matchRoute('[...rest]/path', 'a/b/c/path'), { rest: 'a/b/c' });
});
regression2951('/[...any]_suffix/path', () => {
equal(matchRoute('/[...rest]_suffix/path', '/a/b/c_suffix/path'), { rest: 'a/b/c' });
});
regression2951('/[...a]/[...b]/path', () => {
equal(matchRoute('/[...a]/[...b]/path', '/a/b/c/path'), { a: 'a/b/c', b: '' });
});
regression2951.run();
const regression5080 = suite('routeMatcher/#5080');
regression5080('/[...rest]/suffix', () => {
equal(matchRoute('/[...rest]/', '/a/b/c/suffix/'), { rest: 'a/b/c/suffix' });
equal(matchRoute('/[...rest]/suffix', '/a/b/c/suffix'), { rest: 'a/b/c' });
equal(matchRoute('/[...rest]/suffix', '/a/b/c/suffix/'), { rest: 'a/b/c' });
});
regression5080.run();
const regression5126 = suite('routeMatcher/#5126');
regression5126('/[...dynamicOne]/static-segment/[...dynamicTwo]/', () => {
equal(
matchRoute(
'/[...dynamicOne]/static-segment/[...dynamicTwo]/',
'/abc/xyz/static-segment/more-dynamic-123/'
),
{
dynamicOne: 'abc/xyz',
dynamicTwo: 'more-dynamic-123',
}
);
});
regression5126.run();

38
packages/qwik-city/runtime/src/routing.unit.ts
View File

@@ -1,12 +1,9 @@
import { assert, describe, test } from 'vitest';
import { parseRoutePathname } from '../../buildtime/routing/parse-pathname';
import { suite, test } from 'uvu';
import { equal } from 'uvu/assert';
import { getMenuLoader } from './routing';
import type { MenuData } from './types';
import { matchRoute } from './route-matcher';
const routingTest = suite('routing');
const routeTests = [
{
basenamePath: '/',
@@ -106,13 +103,15 @@ const routeTests = [
},
];
for (const t of routeTests) {
routingTest(`matches ${t.pathname} with ${t.pattern}`, () => {
const actual = parseRoutePathname(t.basenamePath, t.pattern);
const params = matchRoute(actual.routeName, t.pathname);
equal(params, t.result);
});
}
describe('routing', () => {
for (const t of routeTests) {
test(`matches ${t.pathname} with ${t.pattern}`, () => {
const actual = parseRoutePathname(t.basenamePath, t.pattern);
const params = matchRoute(actual.routeName, t.pathname);
assert.deepEqual(params, t.result);
});
}
});
test(`getMenuLoader, crawl up root, trailing slash`, async () => {
const menus: MenuData[] = [
@@ -121,7 +120,7 @@ test(`getMenuLoader, crawl up root, trailing slash`, async () => {
['/', async () => ({ default: { text: 'Root' } })],
];
const loader = getMenuLoader(menus, '/a/b/c/');
equal(await loader!(), { default: { text: 'Root' } });
assert.deepEqual(await loader!(), { default: { text: 'Root' } });
});
test(`getMenuLoader, crawl up root, no trailing slash`, async () => {
@@ -131,7 +130,7 @@ test(`getMenuLoader, crawl up root, no trailing slash`, async () => {
['/', async () => ({ default: { text: 'Root' } })],
];
const loader = getMenuLoader(menus, '/a/b/c');
equal(await loader!(), { default: { text: 'Root' } });
assert.deepEqual(await loader!(), { default: { text: 'Root' } });
});
test(`getMenuLoader, crawl up one, trailing slash`, async () => {
@@ -141,7 +140,7 @@ test(`getMenuLoader, crawl up one, trailing slash`, async () => {
['/', async () => ({ default: { text: 'Root' } })],
];
const loader = getMenuLoader(menus, '/foo/no-menu/');
equal(await loader!(), { default: { text: 'Foo' } });
assert.deepEqual(await loader!(), { default: { text: 'Foo' } });
});
test(`getMenuLoader, crawl up one, no trailing slash`, async () => {
@@ -151,7 +150,7 @@ test(`getMenuLoader, crawl up one, no trailing slash`, async () => {
['/', async () => ({ default: { text: 'Root' } })],
];
const loader = getMenuLoader(menus, '/foo/no-menu');
equal(await loader!(), { default: { text: 'Foo' } });
assert.deepEqual(await loader!(), { default: { text: 'Foo' } });
});
test(`getMenuLoader, exact path, trailing slash`, async () => {
@@ -161,7 +160,7 @@ test(`getMenuLoader, exact path, trailing slash`, async () => {
['/', async () => ({ default: { text: 'Root' } })],
];
const loader = getMenuLoader(menus, '/foo/bar/');
equal(await loader!(), { default: { text: 'Bar' } });
assert.deepEqual(await loader!(), { default: { text: 'Bar' } });
});
test(`getMenuLoader, exact path, no trailing slash`, async () => {
@@ -171,7 +170,7 @@ test(`getMenuLoader, exact path, no trailing slash`, async () => {
['/', async () => ({ default: { text: 'Root' } })],
];
const loader = getMenuLoader(menus, '/foo/bar');
equal(await loader!(), { default: { text: 'Bar' } });
assert.deepEqual(await loader!(), { default: { text: 'Bar' } });
});
test(`getMenuLoader, root`, async () => {
@@ -181,8 +180,5 @@ test(`getMenuLoader, root`, async () => {
['/', async () => ({ default: { text: 'Root' } })],
];
const loader = getMenuLoader(menus, '/');
equal(await loader!(), { default: { text: 'Root' } });
assert.deepEqual(await loader!(), { default: { text: 'Root' } });
});
routingTest.run();
test.run();

247
packages/qwik-city/runtime/src/service-worker/cached-fetch.unit.ts
View File

@@ -1,133 +1,8 @@
import { suite as uvuSuite } from 'uvu';
import { equal } from 'uvu/assert';
/* eslint-disable no-empty-pattern */
import { assert, beforeEach, test } from 'vitest';
import { cachedFetch } from './cached-fetch';
import type { AwaitingRequests, Fetch } from './types';
const test = suite();
test('new request, Failed to fetch', async (ctx) => {
const req = mockRequest('/a.js');
ctx.addFetchError('/a.js', new Error('Failed to fetch'));
try {
const promises: Promise<any>[] = [];
for (let i = 0; i < 10; i++) {
promises.push(cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req));
}
equal(ctx.awaitingRequests.size, 1);
equal(ctx.awaitingRequests.get('/a.js')?.length, 10);
await Promise.all(promises);
throw new Error('should have thrown');
} catch (e: any) {
equal(e.message, 'Failed to fetch');
equal(ctx.fetchRequests, 1);
equal(ctx.awaitingRequests.size, 0);
}
});
test('new request, Failed to fetch', async (ctx) => {
const req = mockRequest('/a.js');
ctx.addFetchError('/a.js', new Error('Failed to fetch'));
try {
await cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req);
throw new Error('should have thrown');
} catch (e: any) {
equal(e.message, 'Failed to fetch');
equal(ctx.fetchRequests, 1);
equal(ctx.awaitingRequests.size, 0);
}
});
test('new request, no existing cache, cache ok response', async (ctx) => {
const req = mockRequest('/a.js');
ctx.addFetchSuccess(mockResponse('/a.js', 'a'));
const promises: Promise<any>[] = [];
for (let i = 0; i < 10; i++) {
promises.push(cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req));
}
equal(ctx.awaitingRequests.size, 1);
equal(ctx.awaitingRequests.get('/a.js')?.length, 10);
const responses = await Promise.all(promises);
equal(responses.length, 10);
equal(responses[0].body, 'a');
equal(responses[1].body, 'a');
equal(ctx.cache.get('/a.js')?.body, 'a');
});
test('new request, no existing cache, do not cache 404 response', async (ctx) => {
const req = mockRequest('/a.js');
ctx.addFetchSuccess(mockResponse('/a.js', '404', false));
const promises: Promise<any>[] = [];
for (let i = 0; i < 10; i++) {
promises.push(cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req));
}
equal(ctx.awaitingRequests.size, 1);
equal(ctx.awaitingRequests.get('/a.js')?.length, 10);
const responses = await Promise.all(promises);
equal(responses.length, 10);
equal(responses[0].body, '404');
equal(responses[1].body, '404');
equal(ctx.cache.get('/a.js'), undefined);
});
test('new request, no cache', async (ctx) => {
const req = mockRequest('/abc.js');
const fetchRes = mockResponse('/abc.js', 'abc');
ctx.addFetchSuccess(fetchRes);
const res = await cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req);
equal(res.body, 'abc');
equal(ctx.fetchRequests, 1);
equal(ctx.awaitingRequests.size, 0);
});
function suite() {
const s = uvuSuite<TestContext>('cachedFetch');
s.before.each((testCtx) => {
const cacheStore = new Map<string, Response>();
const cache: any = {
match: async (url: string) => {
return cacheStore.get(url);
},
put: async (url: string, response: Response) => {
cacheStore.set(url, response);
},
get: (url: string) => cacheStore.get(url),
};
testCtx.cache = cache;
const fetchSuccess = new Map<string, Response>();
const fetchError = new Map<string, Error>();
testCtx.addFetchSuccess = (r) => {
fetchSuccess.set(r.url, r);
};
testCtx.addFetchError = (url, e: Error) => {
fetchError.set(url, e);
};
testCtx.fetchRequests = 0;
testCtx.fetch = async (r: Request) => {
testCtx.fetchRequests++;
const e = fetchError.get(r.url);
if (e) {
throw e;
}
return fetchSuccess.get(r.url)!;
};
testCtx.awaitingRequests = new Map();
});
return s;
}
function mockRequest(url: string): Request {
return {
url,
@@ -140,15 +15,127 @@ function mockResponse(url: string, body: string, ok = true): Response {
interface TestContext {
cache: TestCache;
fetch: Fetch;
fetchRequests: number;
fetchSuccess: Map<string, Response>;
fetchError: Map<string, Error>;
fetch: Fetch;
addFetchSuccess: (response: Response) => void;
addFetchError: (url: string, e: Error) => void;
awaitingRequests: AwaitingRequests;
}
interface TestCache extends Cache {
get: (url: string) => Response;
get: (url: string) => Response | undefined;
}
test.run();
let ctx: TestContext;
beforeEach(() => {
const cacheStore = new Map<string, Response>();
ctx = {
cache: {
match: async (url: string) => {
return cacheStore.get(url);
},
put: async (url: string, response: Response) => {
cacheStore.set(url, response);
},
get: (url: string) => cacheStore.get(url),
} as TestCache,
fetchRequests: 0,
fetchSuccess: new Map<string, Response>(),
fetchError: new Map<string, Error>(),
fetch: async (r: Request) => {
ctx.fetchRequests++;
const e = ctx.fetchError.get(r.url);
if (e) {
throw e;
}
return ctx.fetchSuccess.get(r.url)!;
},
addFetchSuccess: (r) => ctx.fetchSuccess.set(r.url, r),
addFetchError: (url: string, e: Error) => {
ctx.fetchError.set(url, e);
},
awaitingRequests: new Map(),
};
});
test('new request, Failed to fetch', async () => {
const req = mockRequest('/a.js');
ctx.addFetchError('/a.js', new Error('Failed to fetch'));
try {
const promises: Promise<any>[] = [];
for (let i = 0; i < 10; i++) {
promises.push(cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req));
}
assert.deepEqual(ctx.awaitingRequests.size, 1);
assert.deepEqual(ctx.awaitingRequests.get('/a.js')?.length, 10);
await Promise.all(promises);
throw new Error('should have thrown');
} catch (e: any) {
assert.deepEqual(e.message, 'Failed to fetch');
assert.deepEqual(ctx.fetchRequests, 1);
assert.deepEqual(ctx.awaitingRequests.size, 0);
}
});
test('new request, Failed to fetch', async () => {
const req = mockRequest('/a.js');
ctx.addFetchError('/a.js', new Error('Failed to fetch'));
try {
await cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req);
throw new Error('should have thrown');
} catch (e: any) {
assert.deepEqual(e.message, 'Failed to fetch');
assert.deepEqual(ctx.fetchRequests, 1);
assert.deepEqual(ctx.awaitingRequests.size, 0);
}
});
test('new request, no existing cache, cache ok response', async () => {
const req = mockRequest('/a.js');
ctx.addFetchSuccess(mockResponse('/a.js', 'a'));
const promises: Promise<any>[] = [];
for (let i = 0; i < 10; i++) {
promises.push(cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req));
}
assert.deepEqual(ctx.awaitingRequests.size, 1);
assert.deepEqual(ctx.awaitingRequests.get('/a.js')?.length, 10);
const responses = await Promise.all(promises);
assert.deepEqual(responses.length, 10);
assert.deepEqual(responses[0].body, 'a');
assert.deepEqual(responses[1].body, 'a');
assert.deepEqual(ctx.cache.get('/a.js')?.body as any, 'a');
});
test('new request, no existing cache, do not cache 404 response', async () => {
const req = mockRequest('/a.js');
ctx.addFetchSuccess(mockResponse('/a.js', '404', false));
const promises: Promise<any>[] = [];
for (let i = 0; i < 10; i++) {
promises.push(cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req));
}
assert.deepEqual(ctx.awaitingRequests.size, 1);
assert.deepEqual(ctx.awaitingRequests.get('/a.js')?.length, 10);
const responses = await Promise.all(promises);
assert.deepEqual(responses.length, 10);
assert.deepEqual(responses[0].body, '404');
assert.deepEqual(responses[1].body, '404');
assert.deepEqual(ctx.cache.get('/a.js'), undefined);
});
test('new request, no cache', async () => {
const req = mockRequest('/abc.js');
const fetchRes = mockResponse('/abc.js', 'abc');
ctx.addFetchSuccess(fetchRes);
const res = await cachedFetch(ctx.cache, ctx.fetch, ctx.awaitingRequests, req);
assert.deepEqual(res.body as any, 'abc');
assert.deepEqual(ctx.fetchRequests, 1);
assert.deepEqual(ctx.awaitingRequests.size, 0);
});

21
packages/qwik-city/runtime/src/service-worker/utils.unit.ts
View File

@@ -1,8 +1,7 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { Request as NodeRequest, Response as NodeResponse } from 'undici';
import type { AppBundle } from './types';
import { getCacheToDelete, isAppBundleRequest, useCache } from './utils';
import { assert, test } from 'vitest';
test('getCacheToDelete, delete bundles no longer possible', () => {
const appBundles: AppBundle[] = [
@@ -14,7 +13,7 @@ test('getCacheToDelete, delete bundles no longer possible', () => {
'https://qwik.builder.io/build/q-xyz.js',
];
const c = getCacheToDelete(appBundles, cachedUrls);
equal(c, ['https://qwik.builder.io/build/q-xyz.js']);
assert.deepEqual(c, ['https://qwik.builder.io/build/q-xyz.js']);
});
test('getCacheToDelete, none to delete', () => {
@@ -24,7 +23,7 @@ test('getCacheToDelete, none to delete', () => {
];
const cachedUrls = ['https://qwik.builder.io/build/q-abc.js'];
const c = getCacheToDelete(appBundles, cachedUrls);
equal(c, []);
assert.deepEqual(c, []);
});
test('isAppBundleRequest, in buildBundles', () => {
@@ -34,7 +33,7 @@ test('isAppBundleRequest, in buildBundles', () => {
];
const pathname = '/build/q-abc.js';
const c = isAppBundleRequest(appBundles, pathname);
equal(c, true);
assert.deepEqual(c, true);
});
test('isAppBundleRequest, not in buildBundles', () => {
@@ -44,14 +43,14 @@ test('isAppBundleRequest, not in buildBundles', () => {
];
const pathname = '/build/q-xyz.js';
const c = isAppBundleRequest(appBundles, pathname);
equal(c, false);
assert.deepEqual(c, false);
});
test('do not useCache, no response', () => {
const request = mockRequest();
const response = undefined;
const c = useCache(request, response);
equal(c, false);
assert.deepEqual(c, false);
});
test('do not useCache, response has max-age=0', () => {
@@ -59,7 +58,7 @@ test('do not useCache, response has max-age=0', () => {
const response = mockResponse();
response.headers.set('cache-control', 'max-age=0');
const c = useCache(request, response);
equal(c, false);
assert.deepEqual(c, false);
});
test('do not useCache, response has no-cache', () => {
@@ -67,18 +66,16 @@ test('do not useCache, response has no-cache', () => {
const response = mockResponse();
response.headers.set('cache-control', 'no-cache');
const c = useCache(request, response);
equal(c, false);
assert.deepEqual(c, false);
});
test('useCache', () => {
const request = mockRequest();
const response = mockResponse();
const c = useCache(request, response);
equal(c, true);
assert.deepEqual(c, true);
});
test.run();
export function mockRequest(url?: string): Request {
url = url || 'https://qwik.builder.io/';
return new NodeRequest(url) as any;

43
packages/qwik-city/runtime/src/utils.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import type { LinkProps } from './link-component';
import {
getClientDataPath,
@@ -61,7 +60,7 @@ import {
const a = new URL(t.a);
const b = new URL(t.b);
test(`isSameOriginDifferentPathname(${a},${b})`, () => {
equal(isSameOriginDifferentPathname(a, b), t.expect);
assert.equal(isSameOriginDifferentPathname(a, b), t.expect);
});
});
@@ -72,7 +71,7 @@ import {
].forEach((t) => {
test(`getClientEndpointUrl("${t.pathname}")`, () => {
const endpointPath = getClientDataPath(t.pathname);
equal(endpointPath, t.expect);
assert.equal(endpointPath, t.expect);
});
});
@@ -84,7 +83,7 @@ import {
].forEach((t) => {
test(`getClientEndpointUrl("${t.pathname}", "${t.search}")`, () => {
const endpointPath = getClientDataPath(t.pathname, t.search);
equal(endpointPath, t.expect);
assert.equal(endpointPath, t.expect);
});
});
@@ -108,7 +107,7 @@ import {
].forEach((t) => {
test(`toPath("${t.url}")`, () => {
const url = new URL(t.url);
equal(toPath(url), t.expect);
assert.equal(toPath(url), t.expect);
});
});
@@ -145,20 +144,20 @@ import {
},
].forEach((t) => {
test(`isSamePath(${t.a}, ${t.b})`, () => {
equal(isSamePath(new URL(t.a), new URL(t.b)), t.expect);
assert.equal(isSamePath(new URL(t.a), new URL(t.b)), t.expect);
});
});
test(`isSameOrigin`, () => {
equal(
assert.equal(
isSameOrigin(new URL('http://qwik.builder.io/'), new URL('http://qwik.builder.io/about-us')),
true
);
equal(
assert.equal(
isSameOrigin(new URL('https://qwik.builder.io/'), new URL('http://qwik.builder.io/about-us')),
false
);
equal(
assert.equal(
isSameOrigin(new URL('https://builder.io/'), new URL('http://qwik.builder.io/about-us')),
false
);
@@ -182,7 +181,11 @@ test(`isSameOrigin`, () => {
].forEach((t) => {
test(`getClientNavPath ${t.props.href}`, () => {
const baseUrl = new URL('https://qwik.dev/');
equal(getClientNavPath(t.props, { url: baseUrl }), t.expect, `${t.props.href} ${t.expect}`);
assert.equal(
getClientNavPath(t.props, { url: baseUrl }),
t.expect,
`${t.props.href} ${t.expect}`
);
});
});
@@ -190,21 +193,21 @@ test('no prefetch, missing clientNavPath', () => {
const props: LinkProps = { prefetch: true };
const clientNavPath = null;
const currentLoc = new URL('https://qwik.builder.io/contact');
equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), null);
assert.equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), null);
});
test('no prefetch, path and current path the same, has querystring and hash', () => {
const props: LinkProps = {};
const clientNavPath = '/about?qs#hash';
const currentLoc = new URL('https://qwik.builder.io/about');
equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), null);
assert.equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), null);
});
test('no prefetch, path and current path the same', () => {
const props: LinkProps = {};
const clientNavPath = '/about';
const currentLoc = new URL('https://qwik.builder.io/about');
equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), null);
assert.equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), null);
});
test('valid prefetchUrl, has querystring and hash', () => {
@@ -213,7 +216,7 @@ test('valid prefetchUrl, has querystring and hash', () => {
};
const clientNavPath = '/about?qs#hash';
const currentLoc = new URL('https://qwik.builder.io/contact');
equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), '');
assert.equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), '');
});
test('valid prefetchUrl, trailing slash', () => {
@@ -222,14 +225,14 @@ test('valid prefetchUrl, trailing slash', () => {
};
const clientNavPath = '/about/';
const currentLoc = new URL('https://qwik.builder.io/contact');
equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), '');
assert.equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), '');
});
test('valid prefetchUrl, prefetch true', () => {
const props: LinkProps = { prefetch: true };
const clientNavPath = '/about';
const currentLoc = new URL('https://qwik.builder.io/contact');
equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), '');
assert.equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), '');
});
test('valid prefetchUrl, add by default', () => {
@@ -238,14 +241,12 @@ test('valid prefetchUrl, add by default', () => {
};
const clientNavPath = '/about';
const currentLoc = new URL('https://qwik.builder.io/contact');
equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), '');
assert.equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), '');
});
test('prefetch false', () => {
const props: LinkProps = { prefetch: false };
const clientNavPath = '/about';
const currentLoc = new URL('https://qwik.builder.io/contact');
equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), null);
assert.equal(getPrefetchDataset(props, clientNavPath, { url: currentLoc }), null);
});
test.run();

23
packages/qwik-city/static/extract-params.unit.ts
View File

@@ -1,23 +1,18 @@
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { extractParamNames } from './extract-params';
const routeMatchSuite = suite('extractParamNames');
routeMatchSuite('should parse no params', () => {
equal(extractParamNames('/a/b/c'), []);
test('should parse no params', () => {
assert.deepEqual(extractParamNames('/a/b/c'), []);
});
routeMatchSuite('should parse one param', () => {
equal(extractParamNames('/a/[b]/[c]'), ['b', 'c']);
test('should parse one param', () => {
assert.deepEqual(extractParamNames('/a/[b]/[c]'), ['b', 'c']);
});
routeMatchSuite('should parse param in mid urls', () => {
equal(extractParamNames('/a/pre[b]post/pre[c]/[d]post'), ['b', 'c', 'd']);
test('should parse param in mid urls', () => {
assert.deepEqual(extractParamNames('/a/pre[b]post/pre[c]/[d]post'), ['b', 'c', 'd']);
});
routeMatchSuite('should parse rest param', () => {
equal(extractParamNames('/a/[...b]'), ['b']);
test('should parse rest param', () => {
assert.deepEqual(extractParamNames('/a/[...b]'), ['b']);
});
routeMatchSuite.run();

7
packages/qwik-city/utils/format.unit.ts
View File

@@ -1,5 +1,4 @@
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { msToString } from './format';
[
@@ -25,8 +24,6 @@ import { msToString } from './format';
},
].forEach((t) => {
test(`msToString(${t.ms})`, () => {
equal(msToString(t.ms), t.expect);
assert.equal(msToString(t.ms), t.expect);
});
});
test.run();

43
packages/qwik-city/utils/fs.unit.ts
View File

@@ -1,7 +1,6 @@
import { tmpdir } from 'node:os';
import { basename, join } from 'node:path';
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import type { NormalizedPluginOptions } from '../buildtime/types';
import {
createFileId,
@@ -33,7 +32,7 @@ test('isGroupedLayoutName', () => {
{ ext: 'abc', expect: false },
];
t.forEach((c) => {
equal(isGroupedLayoutName(c.ext, false), c.expect, c.ext);
assert.equal(isGroupedLayoutName(c.ext, false), c.expect, c.ext);
});
});
@@ -50,7 +49,7 @@ test('isPageExt', () => {
{ ext: '.sass', expect: false },
];
t.forEach((c) => {
equal(isPageExt(c.ext), c.expect, c.ext);
assert.equal(isPageExt(c.ext), c.expect, c.ext);
});
});
@@ -67,7 +66,7 @@ test('isModuleExt', () => {
{ ext: '.sass', expect: false },
];
t.forEach((c) => {
equal(isModuleExt(c.ext), c.expect, c.ext);
assert.equal(isModuleExt(c.ext), c.expect, c.ext);
});
});
@@ -84,7 +83,7 @@ test('isPageModuleExt', () => {
{ ext: '.sass', expect: false },
];
t.forEach((c) => {
equal(isPageModuleExt(c.ext), c.expect, c.ext);
assert.equal(isPageModuleExt(c.ext), c.expect, c.ext);
});
});
@@ -101,7 +100,7 @@ test('isMarkdownExt', () => {
{ ext: '.sass', expect: false },
];
t.forEach((c) => {
equal(isMarkdownExt(c.ext), c.expect, c.ext);
assert.equal(isMarkdownExt(c.ext), c.expect, c.ext);
});
});
@@ -113,7 +112,7 @@ test('isMenuFileName', () => {
{ name: 'menu.ts', expect: false },
];
t.forEach((c) => {
equal(isMenuFileName(c.name), c.expect, c.name);
assert.equal(isMenuFileName(c.name), c.expect, c.name);
});
});
@@ -136,7 +135,7 @@ test('getExtension', () => {
{ name: undefined, expect: '' },
];
t.forEach((c) => {
equal(getExtension(c.name!), c.expect, c.name!);
assert.equal(getExtension(c.name!), c.expect, c.name!);
});
});
@@ -154,44 +153,44 @@ test('removeExtension', () => {
{ name: undefined, expect: '' },
];
t.forEach((c) => {
equal(removeExtension(c.name!), c.expect, c.name!);
assert.equal(removeExtension(c.name!), c.expect, c.name!);
});
});
test('createFileId, Page dir/index.tsx', () => {
const path = normalizePath(join(routesDir, 'docs', 'index.tsx'));
const p = createFileId(routesDir, path, 'Route');
equal(p, 'DocsRoute');
assert.equal(p, 'DocsRoute');
});
test('createFileId, Page about-us.tsx', () => {
const path = normalizePath(join(routesDir, 'about-us', 'index.tsx'));
const p = createFileId(routesDir, path, 'Route');
equal(p, 'AboutusRoute');
assert.equal(p, 'AboutusRoute');
});
test('createFileId, Endpoint, api/[user]/index.ts', () => {
const path = normalizePath(join(routesDir, 'api', '[user]', 'index.ts'));
const p = createFileId(routesDir, path, 'Route');
equal(p, 'ApiUserRoute');
assert.equal(p, 'ApiUserRoute');
});
test('createFileId, Endpoint, data.json.ts', () => {
const path = normalizePath(join(routesDir, 'api', 'data.json', 'index.ts'));
const p = createFileId(routesDir, path, 'Route');
equal(p, 'ApiDataRoute');
assert.equal(p, 'ApiDataRoute');
});
test('createFileId, Layout', () => {
const path = normalizePath(join(routesDir, 'dashboard', 'settings', 'layout.tsx'));
const p = createFileId(routesDir, path);
equal(p, 'DashboardSettingsLayout');
assert.equal(p, 'DashboardSettingsLayout');
});
test('createFileId, Menu', () => {
const path = normalizePath(join(routesDir, 'settings', 'menu.mdx'));
const p = createFileId(routesDir, path);
equal(p, 'SettingsMenu');
assert.equal(p, 'SettingsMenu');
});
[
@@ -268,7 +267,7 @@ test('createFileId, Menu', () => {
rewriteRoutes: [],
};
const pathname = getPathnameFromDirPath(opts, t.dirPath);
equal(pathname, t.expect, t.dirPath);
assert.equal(pathname, t.expect, t.dirPath);
});
});
@@ -298,8 +297,8 @@ test('parseRouteIndexName', () => {
t.forEach((c) => {
const r = parseRouteIndexName(c.extlessName);
equal(r.layoutName, c.expect.layoutName, `${c.extlessName} layoutName`);
equal(r.layoutStop, c.expect.layoutStop, `${c.extlessName} layoutStop`);
assert.equal(r.layoutName, c.expect.layoutName, `${c.extlessName} layoutName`);
assert.equal(r.layoutStop, c.expect.layoutStop, `${c.extlessName} layoutStop`);
});
});
@@ -353,7 +352,7 @@ test('parseRouteIndexName', () => {
expect: '/',
},
].forEach((t) => {
test(``, () => {
test(`menu-${t.basePathname}-${t.trailingSlash}`, () => {
const opts: NormalizedPluginOptions = {
routesDir,
serverPluginsDir,
@@ -369,8 +368,6 @@ test('parseRouteIndexName', () => {
rewriteRoutes: [],
};
const pathname = getMenuPathname(opts, t.filePath);
equal(pathname, t.expect);
assert.equal(pathname, t.expect);
});
});
test.run();

19
packages/qwik-city/utils/pathname.unit.ts
View File

@@ -1,8 +1,7 @@
import type { PathParams } from '../runtime/src/types';
import { test } from 'uvu';
import { equal } from 'uvu/assert';
import { getPathnameForDynamicRoute, isSameOriginUrl, normalizePathname } from './pathname';
import { parseRoutePathname } from '../buildtime/routing/parse-pathname';
import { assert, test } from 'vitest';
test('isSameOriginUrl', () => {
const t = [
@@ -23,7 +22,7 @@ test('isSameOriginUrl', () => {
{ url: null, expect: false },
];
t.forEach((c) => {
equal(isSameOriginUrl(c.url!), c.expect, c.url!);
assert.equal(isSameOriginUrl(c.url!), c.expect, c.url!);
});
});
@@ -117,7 +116,7 @@ test('normalizePathname', () => {
tests.forEach((t) => {
const pathname = normalizePathname(t.pathname, t.basePathname, t.trailingSlash);
equal(pathname, t.expect);
assert.equal(pathname, t.expect);
});
});
@@ -129,7 +128,7 @@ test('dynamic, rest pathname in segment', () => {
slugId: 'what-is-resumability',
},
});
equal(p, '/blog/start-what-is-resumability-end');
assert.equal(p, '/blog/start-what-is-resumability-end');
});
test('dynamic rest pathname', () => {
@@ -140,7 +139,7 @@ test('dynamic rest pathname', () => {
slugId: 'what-is-resumability',
},
});
equal(p, '/blog/what-is-resumability');
assert.equal(p, '/blog/what-is-resumability');
});
test('dynamic, empty rest pathname in root', () => {
@@ -151,7 +150,7 @@ test('dynamic, empty rest pathname in root', () => {
id: '',
},
});
equal(p, '/');
assert.equal(p, '/');
});
test('dynamic, empty rest pathname in root with nested page', () => {
@@ -162,7 +161,7 @@ test('dynamic, empty rest pathname in root with nested page', () => {
id: '',
},
});
equal(p, '/page');
assert.equal(p, '/page');
});
test('dynamic pathname', () => {
@@ -174,7 +173,7 @@ test('dynamic pathname', () => {
slugId: 'basics',
},
});
equal(p, '/docs/introduction/basics');
assert.equal(p, '/docs/introduction/basics');
});
function getPathname(t: { originalPathname: string; basePathname: string; params?: PathParams }) {
@@ -182,5 +181,3 @@ function getPathname(t: { originalPathname: string; basePathname: string; params
const d = getPathnameForDynamicRoute(t.originalPathname, p.paramNames, t.params);
return normalizePathname(d, '/', false);
}
test.run();

114
packages/qwik-city/utils/test-suite.ts
View File

@@ -1,13 +1,11 @@
/* eslint-disable */
import * as assert from 'uvu/assert';
/* eslint-disable no-empty-pattern */
import { assert, test, beforeAll, type TestAPI } from 'vitest';
import { join } from 'node:path';
import { suite as uvuSuite } from 'uvu';
import type {
BuildContext,
BuildLayout,
BuildRoute,
MarkdownAttributes,
NormalizedPluginOptions,
PluginOptions,
} from '../buildtime/types';
import { createBuildContext } from '../buildtime/context';
@@ -16,80 +14,86 @@ import { normalizePath } from './fs';
import { build } from '../buildtime/build';
import { fileURLToPath } from 'node:url';
export function suite(title?: string) {
const s = uvuSuite<TestContext>(title);
export { assert };
export function suite(title: string = 'qwik-city') {
const rootDir = tmpdir();
const basePath = '/';
s.before.each((testCtx) => {
testCtx.ctx = createBuildContext(rootDir, basePath, {
routesDir: join(rootDir, 'src', 'routes'),
});
testCtx.opts = testCtx.ctx.opts;
testCtx.filePath = join(testCtx.ctx.opts.routesDir, 'welcome.mdx');
testCtx.attrs = { title: '', description: '' };
return test.extend<TestContext>({
ctx: async ({}, use) => {
const ctx = createBuildContext(rootDir, basePath, {
routesDir: join(rootDir, 'src', 'routes'),
});
await use(ctx);
ctx.diagnostics.forEach((d) => console.error(d.message));
},
filePath: ({ ctx }, use) => use(join(ctx.opts.routesDir, 'welcome.mdx')),
attrs: ({}, use) => use({ title: '', description: '' }),
});
s.after.each((testCtx) => {
testCtx.ctx.diagnostics.forEach((d) => console.error(d.message));
});
return s;
}
export function testAppSuite(title: string, userOpts?: PluginOptions) {
const s = uvuSuite<TestAppBuildContext>(title);
let buildCtx: any = null;
export function testAppSuite(
title: string,
userOpts?: PluginOptions
): TestAPI<TestAppBuildContext> {
let buildCtx: BuildContext;
s.before.each(async (testCtx) => {
if (!buildCtx) {
const __dirname = fileURLToPath(new URL('.', import.meta.url));
const testAppRootDir = join(__dirname, '..', '..', '..', 'starters', 'apps', 'qwikcity-test');
const basePath = '/';
const ctx = createBuildContext(testAppRootDir, basePath, userOpts);
beforeAll(async (testCtx) => {
const __dirname = fileURLToPath(new URL('.', import.meta.url));
const testAppRootDir = join(__dirname, '..', '..', '..', 'starters', 'apps', 'qwikcity-test');
const basePath = '/';
const ctx = createBuildContext(testAppRootDir, basePath, userOpts);
assert.is(normalizePath(testAppRootDir), ctx.rootDir);
assert.is(normalizePath(join(testAppRootDir, 'src', 'routes')), ctx.opts.routesDir);
assert.equal(normalizePath(testAppRootDir), ctx.rootDir);
assert.equal(normalizePath(join(testAppRootDir, 'src', 'routes')), ctx.opts.routesDir);
await build(ctx);
await build(ctx);
assert.equal(ctx.diagnostics, []);
assert.deepEqual(ctx.diagnostics, []);
buildCtx = ctx;
Object.assign(testCtx, ctx);
buildCtx = ctx;
Object.assign(testCtx, ctx);
});
testCtx.assertRoute = (p) => {
const r = ctx.routes.find((r) => r.pathname === p);
if (!r) {
console.log(ctx.routes);
assert.ok(r, `did not find page route "${p}"`);
}
return r as any;
};
testCtx.assertLayout = (id) => {
const l = ctx.layouts.find((r) => r.id === id);
if (!l) {
console.log(ctx.layouts);
assert.ok(l, `did not find layout "${id}"`);
}
return l as any;
};
const assertRoute = (p: string) => {
const r = buildCtx.routes.find((r) => r.pathname === p);
if (!r) {
// eslint-disable-next-line no-console
console.log(buildCtx.routes);
assert.ok(r, `did not find page route "${p}"`);
}
return r as any;
};
const assertLayout = (id: string) => {
const l = buildCtx.layouts.find((r) => r.id === id);
if (!l) {
// eslint-disable-next-line no-console
console.log(buildCtx.layouts);
assert.ok(l, `did not find layout "${id}"`);
}
return l as any;
};
const myTest = test.extend<TestAppBuildContext>({
ctx: async ({}, use) => use(buildCtx),
filePath: ({ ctx }, use) => use(join(ctx.opts.routesDir, 'welcome.mdx')),
attrs: ({}, use) => use({ title: '', description: '' }),
assertRoute: ({}, use) => use(assertRoute),
assertLayout: ({}, use) => use(assertLayout),
});
return s;
return myTest;
}
export interface TestAppBuildContext extends BuildContext {
export interface TestAppBuildContext extends TestContext {
assertRoute: (pathname: string) => BuildRoute;
assertLayout: (id: string) => BuildLayout;
}
export interface TestContext {
rootDir: string;
ctx: BuildContext;
opts: NormalizedPluginOptions;
filePath: string;
attrs: MarkdownAttributes;
}

24
packages/qwik-labs/package.json
View File

@@ -3,18 +3,18 @@
"description": "Qwik Labs - Where you can try the latest Qwik ideas.",
"version": "0.0.1",
"devDependencies": {
"@builder.io/qwik": "1.2.6",
"@types/eslint": "8.44.1",
"@types/node": "^20.4.5",
"@typescript-eslint/eslint-plugin": "6.2.0",
"@typescript-eslint/parser": "6.2.0",
"eslint": "8.45.0",
"eslint-plugin-qwik": "1.2.6",
"np": "7.6.1",
"prettier": "3.0.0",
"typescript": "5.1.6",
"undici": "5.22.1",
"vite": "4.4.7"
"@builder.io/qwik": "^1.2.13",
"@types/eslint": "^8.44.4",
"@types/node": "^20.8.4",
"@typescript-eslint/eslint-plugin": "^6.7.5",
"@typescript-eslint/parser": "^6.7.5",
"eslint": "^8.51.0",
"eslint-plugin-qwik": "^1.2.13",
"np": "^8.0.4",
"prettier": "^3.0.3",
"typescript": "^5.2.2",
"undici": "^5.26.0",
"vite": "^4.4.11"
},
"engines": {
"node": ">=16.8.0 <18.0.0 || >=18.11"

8
packages/qwik-react/package.json
View File

@@ -5,12 +5,12 @@
"bugs": "https://github.com/BuilderIO/qwik/issues",
"devDependencies": {
"@builder.io/qwik": "workspace:*",
"@types/react": "18.2.17",
"@types/react-dom": "18.2.7",
"@types/react": "^18.2.28",
"@types/react-dom": "^18.2.13",
"react": "18.2.0",
"react-dom": "18.2.0",
"typescript": "5.1.6",
"vite": "4.4.7"
"typescript": "^5.2.2",
"vite": "^4.4.11"
},
"engines": {
"node": ">=16.8.0 <18.0.0 || >=18.11"

2
packages/qwik-worker/package.json
View File

@@ -5,7 +5,7 @@
"bugs": "https://github.com/BuilderIO/qwik/issues",
"devDependencies": {
"@builder.io/qwik": "workspace:*",
"vite": "4.4.7",
"vite": "^4.4.11",
"vite-plugin-static-copy": "^0.17.0"
},
"engines": {

56
packages/qwik/src/cli/code-mod/code-mod.unit.ts
View File

@@ -1,6 +1,5 @@
import { test, assert } from 'vitest';
import { updateViteConfig } from './code-mod';
import { test } from 'uvu';
import { match, equal } from 'uvu/assert';
import ts from 'typescript';
const prepareOutput = (str: string) =>
@@ -22,7 +21,10 @@ test('update existing qwik vite plugin config prop', () => {
const outputText = updateViteConfig(ts, sourceText, {
qwikViteConfig: { ssr: `{ outDir: 'netlify/edge-functions/entry.netlify' }` },
})!;
match(outputText, 'qwikVite({ ssr: { outDir: "netlify/edge-functions/entry.netlify" } })');
assert.include(
outputText,
'qwikVite({ ssr: { outDir: "netlify/edge-functions/entry.netlify" } })'
);
});
test('update qwik vite plugin config', () => {
@@ -38,7 +40,7 @@ test('update qwik vite plugin config', () => {
const outputText = updateViteConfig(ts, sourceText, {
qwikViteConfig: { ssr: `{ outDir: 'netlify/edge-functions/entry.netlify' }` },
})!;
match(
assert.include(
outputText,
'qwikVite({ ssr: { outDir: "netlify/edge-functions/entry.netlify" }, abc: 88 })'
);
@@ -57,7 +59,10 @@ test('add qwik vite plugin config', () => {
const outputText = updateViteConfig(ts, sourceText, {
qwikViteConfig: { ssr: `{ outDir: 'netlify/edge-functions/entry.netlify' }` },
})!;
match(outputText, 'qwikVite({ ssr: { outDir: "netlify/edge-functions/entry.netlify" } })');
assert.include(
outputText,
'qwikVite({ ssr: { outDir: "netlify/edge-functions/entry.netlify" } })'
);
});
test('add qwik vite plugin config for object based vite config', () => {
@@ -71,7 +76,10 @@ test('add qwik vite plugin config for object based vite config', () => {
const outputText = updateViteConfig(ts, sourceText, {
qwikViteConfig: { ssr: `{ outDir: 'netlify/edge-functions/entry.netlify' }` },
})!;
match(outputText, 'qwikVite({ ssr: { outDir: "netlify/edge-functions/entry.netlify" } })');
assert.include(
outputText,
'qwikVite({ ssr: { outDir: "netlify/edge-functions/entry.netlify" } })'
);
});
test('add vite plugin', () => {
@@ -87,7 +95,7 @@ test('add vite plugin', () => {
const outputText = updateViteConfig(ts, sourceText, {
vitePlugins: [`netlifyEdge({ functionName: 'entry.netlify' })`],
})!;
match(outputText, 'netlifyEdge({ functionName: "entry.netlify" })');
assert.include(outputText, 'netlifyEdge({ functionName: "entry.netlify" })');
});
test('add vite plugin to object based config', () => {
@@ -101,7 +109,7 @@ test('add vite plugin to object based config', () => {
const outputText = updateViteConfig(ts, sourceText, {
vitePlugins: [`netlifyEdge({ functionName: 'entry.netlify' })`],
})!;
match(outputText, 'netlifyEdge({ functionName: "entry.netlify" })');
assert.include(outputText, 'netlifyEdge({ functionName: "entry.netlify" })');
});
test('should not add vite plugin if it is already defined', () => {
@@ -128,7 +136,7 @@ test('should not add vite plugin if it is already defined', () => {
};
});
`;
equal(prepareOutput(outputText), prepareOutput(expected));
assert.deepEqual(prepareOutput(outputText), prepareOutput(expected));
});
test('update vite config', () => {
@@ -145,7 +153,7 @@ test('update vite config', () => {
const outputText = updateViteConfig(ts, sourceText, {
viteConfig: { ssr: `{ target: 'webworker', noExternal: true }` },
})!;
match(outputText, 'ssr: { target: "webworker", noExternal: true');
assert.include(outputText, 'ssr: { target: "webworker", noExternal: true');
});
test('update object based vite config', () => {
@@ -160,7 +168,7 @@ test('update object based vite config', () => {
const outputText = updateViteConfig(ts, sourceText, {
viteConfig: { ssr: `{ target: 'webworker', noExternal: true }` },
})!;
match(outputText, 'ssr: { target: "webworker", noExternal: true');
assert.include(outputText, 'ssr: { target: "webworker", noExternal: true');
});
test('add vite config', () => {
@@ -176,7 +184,7 @@ test('add vite config', () => {
const outputText = updateViteConfig(ts, sourceText, {
viteConfig: { ssr: `{ target: 'webworker', noExternal: true }` },
})!;
match(outputText, 'ssr: { target: "webworker", noExternal: true');
assert.include(outputText, 'ssr: { target: "webworker", noExternal: true');
});
test('add imports to side effect default import', () => {
@@ -187,8 +195,8 @@ test('add imports to side effect default import', () => {
{ namedImports: ['c', 'd'], importPath: '@builder.io/sdk-react' },
],
})!;
match(outputText, 'import a, { b } from "@builder.io/qwik";');
match(outputText, 'import { c, d } from "@builder.io/sdk-react";');
assert.include(outputText, 'import a, { b } from "@builder.io/qwik";');
assert.include(outputText, 'import { c, d } from "@builder.io/sdk-react";');
});
test('do not re-add named imports', () => {
@@ -202,8 +210,8 @@ test('do not re-add named imports', () => {
{ namedImports: ['b', 'c'], importPath: '@builder.io/sdk-react' },
],
})!;
match(outputText, 'import { a } from "@builder.io/qwik";');
match(outputText, 'import { b, c } from "@builder.io/sdk-react";');
assert.include(outputText, 'import { a } from "@builder.io/qwik";');
assert.include(outputText, 'import { b, c } from "@builder.io/sdk-react";');
});
test('add imports to side effect import', () => {
@@ -211,7 +219,7 @@ test('add imports to side effect import', () => {
const outputText = updateViteConfig(ts, sourceText, {
imports: [{ namedImports: ['a'], importPath: '@builder.io/qwik' }],
})!;
match(outputText, 'import { a } from "@builder.io/qwik"');
assert.include(outputText, 'import { a } from "@builder.io/qwik"');
});
test('leave existing imports', () => {
@@ -219,7 +227,7 @@ test('leave existing imports', () => {
const outputText = updateViteConfig(ts, sourceText, {
imports: [{ namedImports: ['b'], importPath: '@builder.io/qwik' }],
})!;
match(outputText, 'import { a, b } from "@builder.io/qwik";');
assert.include(outputText, 'import { a, b } from "@builder.io/qwik";');
});
test('renamed default import with existing named import', () => {
@@ -230,8 +238,8 @@ test('renamed default import with existing named import', () => {
{ namedImports: ['d'], importPath: '@builder.io/qwik' },
],
})!;
match(outputText, 'import c, { b } from "@builder.io/sdk-react";');
match(outputText, 'import { d } from "@builder.io/qwik";');
assert.include(outputText, 'import c, { b } from "@builder.io/sdk-react";');
assert.include(outputText, 'import { d } from "@builder.io/qwik";');
});
test('renamed default import', () => {
@@ -239,7 +247,7 @@ test('renamed default import', () => {
const outputText = updateViteConfig(ts, sourceText, {
imports: [{ defaultImport: 'b', importPath: '@builder.io/sdk-react' }],
})!;
match(outputText, 'import b from "@builder.io/sdk-react";');
assert.include(outputText, 'import b from "@builder.io/sdk-react";');
});
test('add default import to empty file', () => {
@@ -247,7 +255,7 @@ test('add default import to empty file', () => {
const outputText = updateViteConfig(ts, sourceText, {
imports: [{ defaultImport: 'a', importPath: '@builder.io/sdk-react' }],
})!;
match(outputText, 'import a from "@builder.io/sdk-react";');
assert.include(outputText, 'import a from "@builder.io/sdk-react";');
});
test('add named imports to empty file', () => {
@@ -255,7 +263,5 @@ test('add named imports to empty file', () => {
const outputText = updateViteConfig(ts, sourceText, {
imports: [{ namedImports: ['a'], importPath: '@builder.io/sdk-react' }],
})!;
match(outputText, 'import { a } from "@builder.io/sdk-react";');
assert.include(outputText, 'import { a } from "@builder.io/sdk-react";');
});
test.run();

101
packages/qwik/src/core/component/component.unit.tsx
View File

@@ -1,24 +1,24 @@
import { createDOM } from '../../testing/library';
import { expectDOM } from '../../testing/expect-dom.unit';
import { expectDOM } from '../../testing/expect-dom';
import { inlinedQrl } from '../qrl/qrl';
import { useStylesQrl } from '../use/use-styles';
import { type PropsOf, component$ } from './component.public';
import { suite } from 'uvu';
import { useStore } from '../use/use-store.public';
import { useLexicalScope } from '../use/use-lexical-scope.public';
import { describe, test } from 'vitest';
/**
* Applying new unit test library/layer
*
* `@builder.io/qwik/testing` ==> ../../testing/library
*/
const qComponent = suite('q-component');
qComponent('should declare and render basic component', async () => {
const { screen, render } = await createDOM();
await render(<HelloWorld />);
await expectDOM(
screen,
`
describe('q-component', () => {
/**
* Applying new unit test library/layer
*
* `@builder.io/qwik/testing` ==> ../../testing/library
*/
test('should declare and render basic component', async () => {
const { screen, render } = await createDOM();
await render(<HelloWorld />);
await expectDOM(
screen,
`
<host q:version="dev" q:container="resumed" q:render="dom-dev">
<style q:style="pfkgyr-0" hidden="">
{}
@@ -27,16 +27,16 @@ qComponent('should declare and render basic component', async () => {
<span>Hello World</span>
<!--/qv-->
</host>`
);
});
);
});
qComponent('should render Counter and accept events', async () => {
const { screen, render, userEvent } = await createDOM();
test('should render Counter and accept events', async () => {
const { screen, render, userEvent } = await createDOM();
await render(<MyCounter step={5} value={15} />);
await expectDOM(
screen,
`
await render(<MyCounter step={5} value={15} />);
await expectDOM(
screen,
`
<host q:version="dev" q:container="resumed" q:render="dom-dev">
<!--qv -->
<my-counter>
@@ -46,11 +46,11 @@ qComponent('should render Counter and accept events', async () => {
</my-counter>
<!--/qv-->
</host>`
);
await userEvent('button.decrement', 'click');
await expectDOM(
screen,
`
);
await userEvent('button.decrement', 'click');
await expectDOM(
screen,
`
<host q:version="dev" q:container="resumed" q:render="dom-dev">
<!--qv -->
<my-counter>
@@ -68,29 +68,29 @@ qComponent('should render Counter and accept events', async () => {
</my-counter>
<!--/qv-->
</host>`
);
});
);
});
qComponent('should render a collection of todo items', async () => {
const { screen, render } = await createDOM();
test('should render a collection of todo items', async () => {
const { screen, render } = await createDOM();
const items = {
items: [
{
done: true,
title: 'Task 1',
},
{
done: false,
title: 'Task 2',
},
],
};
await render(<Items items={items} />);
await delay(0);
await expectDOM(
screen,
`
const items = {
items: [
{
done: true,
title: 'Task 1',
},
{
done: false,
title: 'Task 2',
},
],
};
await render(<Items items={items} />);
await delay(0);
await expectDOM(
screen,
`
<host q:version="dev" q:container="resumed" q:render="dom-dev">
<!--qv -->
<items>
@@ -111,7 +111,8 @@ qComponent('should render a collection of todo items', async () => {
<!--/qv-->
</host>
`
);
);
});
});
/////////////////////////////////////////////////////////////////////////////
@@ -208,5 +209,3 @@ export const Items = component$((props: { items: ItemsObj }) => {
function delay(milliseconds: number): Promise<void> {
return new Promise((res) => setTimeout(res, milliseconds));
}
qComponent.run();

13
packages/qwik/src/core/container/store.unit.tsx
View File

@@ -5,18 +5,15 @@ import { component$ } from '../component/component.public';
import { $ } from '../qrl/qrl.public';
import { logDebug } from '../util/log';
import { inlinedQrl } from '../qrl/qrl';
import { suite } from 'uvu';
import { render } from '../render/dom/render.public';
import { expectDOM } from '../../testing/expect-dom.unit';
import { expectDOM } from '../../testing/expect-dom';
import { pauseContainer } from './pause';
import { noSerialize } from '../state/common';
import { useSignal } from '../use/use-signal';
import { getQwikJSON } from './resume';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
const storeSuite = suite('store');
storeSuite.skip('should serialize content', async () => {
test.skip('should serialize content', async () => {
const document = createDocument();
await render(
@@ -58,7 +55,7 @@ storeSuite.skip('should serialize content', async () => {
</body>`
);
equal(JSON.parse(script.textContent!), {
assert.deepEqual(JSON.parse(script.textContent!), {
refs: {
'1': '1 2 f o 8 i 7 6 k! o l 0 n',
},
@@ -171,5 +168,3 @@ export const LexicalScope = component$(() => {
]);
return <div onClick$={thing}>{signal as any}</div>;
});
storeSuite.run();

6
packages/qwik/src/core/qrl/qrl-class.ts
View File

@@ -10,7 +10,7 @@ import {
newInvokeContextFromTuple,
tryGetInvokeContext,
} from '../use/use-core';
import { then } from '../util/promises';
import { maybeThen } from '../util/promises';
import { qDev, qSerialize, qTest, seal } from '../util/qdev';
import { isArray, isFunction, type ValueOrPromise } from '../util/types';
import type { QRLDev } from './qrl';
@@ -92,7 +92,7 @@ export const createQRL = <TYPE>(
return (symbolRef = symbolFn().then((module) => (qrl.resolved = symbolRef = module[symbol])));
} else {
const symbol2 = getPlatform().importSymbol(_containerEl, chunk, symbol);
return (symbolRef = then(symbol2, (ref) => {
return (symbolRef = maybeThen(symbol2, (ref) => {
return (qrl.resolved = symbolRef = ref);
}));
}
@@ -110,7 +110,7 @@ export const createQRL = <TYPE>(
return ((...args: any[]): any => {
const start = now();
const fn = resolveLazy() as TYPE;
return then(fn, (fn) => {
return maybeThen(fn, (fn) => {
if (isFunction(fn)) {
if (beforeFn && beforeFn() === false) {
return;

177
packages/qwik/src/core/qrl/qrl.unit.ts
View File

@@ -1,95 +1,100 @@
import { parseQRL, serializeQRL } from './qrl';
import { createQRL } from './qrl-class';
import { qrl } from './qrl';
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
const qrlSuite = suite('serialization');
qrlSuite('should parse', () => {
matchProps(parseQRL('./chunk#default'), {
$chunk$: './chunk',
$symbol$: 'default',
resolved: undefined,
});
matchProps(parseQRL('./chunk#mySymbol'), {
$chunk$: './chunk',
$symbol$: 'mySymbol',
});
matchProps(parseQRL('./chunk#mySymbol'), {
$chunk$: './chunk',
$symbol$: 'mySymbol',
});
matchProps(parseQRL('./chunk#s1'), {
$chunk$: './chunk',
$symbol$: 's1',
$capture$: [],
});
matchProps(parseQRL('./chunk#s1[1 b]'), {
$chunk$: './chunk',
$symbol$: 's1',
$capture$: ['1', 'b'],
});
matchProps(parseQRL('./chunk#s1[1 b]'), {
$chunk$: './chunk',
$symbol$: 's1',
$capture$: ['1', 'b'],
});
matchProps(parseQRL('./chunk#s1[1 b]'), {
$chunk$: './chunk',
$symbol$: 's1',
$capture$: ['1', 'b'],
});
matchProps(parseQRL('./chunk[1 b]'), {
$chunk$: './chunk',
$capture$: ['1', 'b'],
});
matchProps(parseQRL('./path#symbol[2]'), {
$chunk$: './path',
$symbol$: 'symbol',
$capture$: ['2'],
});
});
qrlSuite('serialize qrls', () => {
equal(serializeQRL(createQRL('./chunk', '', null, null, null, null, null)), 'chunk#');
equal(serializeQRL(createQRL('./c', 's1', null, null, null, null, null)), 'c#s1');
equal(serializeQRL(createQRL('./c', 's1', null, null, [], null, null)), 'c#s1');
equal(serializeQRL(createQRL('./c', 's1', null, null, [1, '2'] as any, null, null)), 'c#s1[1 2]');
equal(serializeQRL(createQRL('c', 's1', null, null, [1 as any, '2'], null, null)), 'c#s1[1 2]');
});
qrlSuite('should parse reference', () => {
const require = (str: string) => {
console.warn(str);
};
matchProps(
qrl(
() =>
Promise.resolve().then(function () {
return require('./h_my-app_myapp_init-73253fd4.js');
}),
'MyApp_init'
),
{
$chunk$: './h_my-app_myapp_init-73253fd4.js',
$symbol$: 'MyApp_init',
}
);
});
qrlSuite('should parse self-reference', () => {});
qrlSuite('should store resolved value', async () => {
const q = qrl(() => Promise.resolve({ hi: 'hello' }), 'hi');
equal(q.resolved, undefined);
await q.resolve();
equal(q.resolved, 'hello');
});
import { describe, test, assert } from 'vitest';
function matchProps(obj: any, properties: Record<string, any>) {
for (const [key, value] of Object.entries(properties)) {
equal(obj[key], value, `${obj[key]} !== ${value}`);
assert.deepEqual(obj[key], value, `${obj[key]} !== ${value}`);
}
}
qrlSuite.run();
describe('serialization', () => {
test('should parse', () => {
matchProps(parseQRL('./chunk#default'), {
$chunk$: './chunk',
$symbol$: 'default',
resolved: undefined,
});
matchProps(parseQRL('./chunk#mySymbol'), {
$chunk$: './chunk',
$symbol$: 'mySymbol',
});
matchProps(parseQRL('./chunk#mySymbol'), {
$chunk$: './chunk',
$symbol$: 'mySymbol',
});
matchProps(parseQRL('./chunk#s1'), {
$chunk$: './chunk',
$symbol$: 's1',
$capture$: [],
});
matchProps(parseQRL('./chunk#s1[1 b]'), {
$chunk$: './chunk',
$symbol$: 's1',
$capture$: ['1', 'b'],
});
matchProps(parseQRL('./chunk#s1[1 b]'), {
$chunk$: './chunk',
$symbol$: 's1',
$capture$: ['1', 'b'],
});
matchProps(parseQRL('./chunk#s1[1 b]'), {
$chunk$: './chunk',
$symbol$: 's1',
$capture$: ['1', 'b'],
});
matchProps(parseQRL('./chunk[1 b]'), {
$chunk$: './chunk',
$capture$: ['1', 'b'],
});
matchProps(parseQRL('./path#symbol[2]'), {
$chunk$: './path',
$symbol$: 'symbol',
$capture$: ['2'],
});
});
test('serialize qrls', () => {
assert.equal(serializeQRL(createQRL('./chunk', '', null, null, null, null, null)), 'chunk#');
assert.equal(serializeQRL(createQRL('./c', 's1', null, null, null, null, null)), 'c#s1');
assert.equal(serializeQRL(createQRL('./c', 's1', null, null, [], null, null)), 'c#s1');
assert.equal(
serializeQRL(createQRL('./c', 's1', null, null, [1, '2'] as any, null, null)),
'c#s1[1 2]'
);
assert.equal(
serializeQRL(createQRL('c', 's1', null, null, [1 as any, '2'], null, null)),
'c#s1[1 2]'
);
});
test('should parse reference', () => {
const require = (str: string) => {
console.warn(str);
};
matchProps(
qrl(
() =>
Promise.resolve().then(function () {
return require('./h_my-app_myapp_init-73253fd4.js');
}),
'MyApp_init'
),
{
$chunk$: './h_my-app_myapp_init-73253fd4.js',
$symbol$: 'MyApp_init',
}
);
});
// See https://github.com/BuilderIO/qwik/issues/5087#issuecomment-1707185010
test.skip('should parse self-reference', () => {});
test('should store resolved value', async () => {
const q = qrl(() => Promise.resolve({ hi: 'hello' }), 'hi');
assert.equal(q.resolved, undefined);
await q.resolve();
assert.equal(q.resolved, 'hello');
});
});

14
packages/qwik/src/core/render/dom/notify-render.ts
View File

@@ -12,7 +12,7 @@ import {
TaskFlagsIsTask,
isSubscriberDescriptor,
} from '../../use/use-task';
import { then } from '../../util/promises';
import { maybeThen } from '../../util/promises';
import type { ValueOrPromise } from '../../util/types';
import { useLexicalScope } from '../../use/use-lexical-scope.public';
import { renderComponent } from './render-dom';
@@ -252,11 +252,11 @@ const executeTasksBefore = async (containerState: ContainerState, rCtx: RenderCo
containerState.$taskNext$.forEach((task) => {
if (isTask(task)) {
taskPromises.push(then(task.$qrl$.$resolveLazy$(containerEl), () => task));
taskPromises.push(maybeThen(task.$qrl$.$resolveLazy$(containerEl), () => task));
containerState.$taskNext$.delete(task);
}
if (isResourceTask(task)) {
resourcesPromises.push(then(task.$qrl$.$resolveLazy$(containerEl), () => task));
resourcesPromises.push(maybeThen(task.$qrl$.$resolveLazy$(containerEl), () => task));
containerState.$taskNext$.delete(task);
}
});
@@ -264,9 +264,9 @@ const executeTasksBefore = async (containerState: ContainerState, rCtx: RenderCo
// Run staging effected
containerState.$taskStaging$.forEach((task) => {
if (isTask(task)) {
taskPromises.push(then(task.$qrl$.$resolveLazy$(containerEl), () => task));
taskPromises.push(maybeThen(task.$qrl$.$resolveLazy$(containerEl), () => task));
} else if (isResourceTask(task)) {
resourcesPromises.push(then(task.$qrl$.$resolveLazy$(containerEl), () => task));
resourcesPromises.push(maybeThen(task.$qrl$.$resolveLazy$(containerEl), () => task));
} else {
containerState.$taskNext$.add(task);
}
@@ -305,7 +305,7 @@ const executeTasksAfter = async (
containerState.$taskNext$.forEach((task) => {
if (taskPred(task, false)) {
if (task.$el$.isConnected) {
taskPromises.push(then(task.$qrl$.$resolveLazy$(containerEl), () => task));
taskPromises.push(maybeThen(task.$qrl$.$resolveLazy$(containerEl), () => task));
}
containerState.$taskNext$.delete(task);
}
@@ -315,7 +315,7 @@ const executeTasksAfter = async (
containerState.$taskStaging$.forEach((task) => {
if (task.$el$.isConnected) {
if (taskPred(task, true)) {
taskPromises.push(then(task.$qrl$.$resolveLazy$(containerEl), () => task));
taskPromises.push(maybeThen(task.$qrl$.$resolveLazy$(containerEl), () => task));
} else {
containerState.$taskNext$.add(task);
}

12
packages/qwik/src/core/render/dom/render-dom.ts
View File

@@ -2,7 +2,7 @@ import { qError, QError_invalidJsxNodeType } from '../../error/error';
import { type InvokeContext, newInvokeContext, invoke } from '../../use/use-core';
import { EMPTY_ARRAY, EMPTY_OBJ } from '../../util/flyweight';
import { logWarn } from '../../util/log';
import { isNotNullable, isPromise, promiseAll, then } from '../../util/promises';
import { isNotNullable, isPromise, promiseAll, maybeThen } from '../../util/promises';
import { qDev, qInspector, seal } from '../../util/qdev';
import { isArray, isFunction, isObject, isString, type ValueOrPromise } from '../../util/types';
import { domToVnode, smartUpdateChildren } from './visitor';
@@ -30,7 +30,7 @@ export const renderComponent = (
containerState.$subsManager$.$clearSub$(hostElement);
// TODO, serialize scopeIds
return then(executeComponent(rCtx, elCtx), (res) => {
return maybeThen(executeComponent(rCtx, elCtx), (res) => {
const staticCtx = rCtx.$static$;
const newCtx = res.rCtx;
const iCtx = newInvokeContext(rCtx.$static$.$locale$, hostElement);
@@ -45,11 +45,11 @@ export const renderComponent = (
}
}
const processedJSXNode = processData(res.node, iCtx);
return then(processedJSXNode, (processedJSXNode) => {
return maybeThen(processedJSXNode, (processedJSXNode) => {
const newVdom = wrapJSX(hostElement, processedJSXNode);
// const oldVdom = getVdom(hostElement);
const oldVdom = getVdom(elCtx);
return then(smartUpdateChildren(newCtx, oldVdom, newVdom, flags), () => {
return maybeThen(smartUpdateChildren(newCtx, oldVdom, newVdom, flags), () => {
// setVdom(hostElement, newVdom);
elCtx.$vdom$ = newVdom;
});
@@ -108,7 +108,7 @@ export const processNode = (
}
let convertedChildren: ProcessedJSXNode[] = EMPTY_ARRAY;
if (children != null) {
return then(processData(children, invocationContext), (result) => {
return maybeThen(processData(children, invocationContext), (result) => {
if (result !== undefined) {
convertedChildren = isArray(result) ? result : [result];
}
@@ -170,7 +170,7 @@ export const processData = (
return newNode;
} else if (isArray(node)) {
const output = promiseAll(node.flatMap((n) => processData(n, invocationContext)));
return then(output, (array) => array.flat(100).filter(isNotNullable));
return maybeThen(output, (array) => array.flat(100).filter(isNotNullable));
} else if (isPromise(node)) {
return node.then((node) => processData(node, invocationContext));
} else if (node === SkipRender) {

113
packages/qwik/src/core/render/dom/render.unit.tsx
View File

@@ -1,5 +1,5 @@
import { ElementFixture, trigger } from '../../../testing/element-fixture';
import { expectDOM } from '../../../testing/expect-dom.unit';
import { expectDOM } from '../../../testing/expect-dom';
import { component$ } from '../../component/component.public';
import { inlinedQrl } from '../../qrl/qrl';
import { useLexicalScope } from '../../use/use-lexical-scope.public';
@@ -9,24 +9,22 @@ import { useOn } from '../../use/use-on';
import { Slot } from '../jsx/slot.public';
import { render } from './render.public';
import { useStylesQrl, useStylesScopedQrl } from '../../use/use-styles';
import { equal, match } from 'uvu/assert';
import { suite } from 'uvu';
import { pauseContainer } from '../../container/pause';
import { useSignal } from '../../use/use-signal';
import { assert, test } from 'vitest';
const renderSuite = suite('render');
renderSuite('should render basic content', async () => {
test('should render basic content', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <div></div>);
await expectRendered(fixture, '<div></div>');
equal(fixture.host.getAttribute('q:version'), 'dev');
equal(fixture.host.getAttribute('q:container'), 'resumed');
assert.equal(fixture.host.getAttribute('q:version'), 'dev');
assert.equal(fixture.host.getAttribute('q:container'), 'resumed');
await pauseContainer(fixture.host);
equal(fixture.host.getAttribute('q:container'), 'paused');
assert.equal(fixture.host.getAttribute('q:container'), 'paused');
});
renderSuite('should only render string/number', async () => {
test('should only render string/number', async () => {
const fixture = new ElementFixture();
await render(
fixture.host,
@@ -43,7 +41,7 @@ renderSuite('should only render string/number', async () => {
await expectRendered(fixture, '<div>string123</div>');
});
renderSuite('should serialize events correctly', async () => {
test('should serialize events correctly', async () => {
const fixture = new ElementFixture();
await render(
fixture.host,
@@ -73,13 +71,13 @@ renderSuite('should serialize events correctly', async () => {
`
);
});
renderSuite('should serialize boolean attributes correctly', async () => {
test('should serialize boolean attributes correctly', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <input required={true} disabled={false}></input>);
await expectRendered(fixture, '<input required="" />');
});
renderSuite('should render aria', async () => {
test('should render aria', async () => {
const fixture = new ElementFixture();
await render(
fixture.host,
@@ -99,7 +97,7 @@ renderSuite('should render aria', async () => {
);
});
renderSuite('should render into a document', async () => {
test('should render into a document', async () => {
const fixture = new ElementFixture();
fixture.document.head.appendChild(fixture.document.createElement('existing'));
await render(
@@ -135,13 +133,13 @@ renderSuite('should render into a document', async () => {
);
});
renderSuite('should render attributes', async () => {
test('should render attributes', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <div id="abc" title="bar" preventdefault:click></div>);
await expectRendered(fixture, '<div id="abc" title="bar" preventdefault:click=""></div>');
});
renderSuite('should render style only for defined attributes', async () => {
test('should render style only for defined attributes', async () => {
const fixture = new ElementFixture();
await render(
fixture.host,
@@ -160,7 +158,7 @@ renderSuite('should render style only for defined attributes', async () => {
);
});
renderSuite('should render style css variables correctly', async () => {
test('should render style css variables correctly', async () => {
const fixture = new ElementFixture();
await render(
fixture.host,
@@ -179,7 +177,7 @@ renderSuite('should render style css variables correctly', async () => {
);
});
renderSuite('should render children', async () => {
test('should render children', async () => {
const fixture = new ElementFixture();
await render(
fixture.host,
@@ -190,7 +188,7 @@ renderSuite('should render children', async () => {
await expectRendered(fixture, '<div><span>text</span></div>');
});
renderSuite('should render svg', async () => {
test('should render svg', async () => {
const fixture = new ElementFixture();
await render(
fixture.host,
@@ -201,14 +199,14 @@ renderSuite('should render svg', async () => {
await expectRendered(fixture, '<svg viewBox="0 0 100 100"><span>text</span></svg>');
});
renderSuite('should render a component', async () => {
test('should render a component', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <HelloWorld name="World" />);
await expectRendered(fixture, '<span>Hello World</span>');
});
renderSuite('should render a component with scoped styles', async () => {
test('should render a component with scoped styles', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <HelloWorldScoped />);
@@ -259,7 +257,7 @@ renderSuite('should render a component with scoped styles', async () => {
);
});
renderSuite('should render component external props', async () => {
test('should render component external props', async () => {
const fixture = new ElementFixture();
await render(
@@ -272,14 +270,14 @@ renderSuite('should render component external props', async () => {
);
});
renderSuite('should render a blank component', async () => {
test('should render a blank component', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <InnerHTMLComponent />);
await expectRendered(fixture, `<div><span>WORKS</span></div>`);
});
renderSuite('should render a div then a component', async () => {
test('should render a div then a component', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <ToggleRootComponent />);
@@ -313,7 +311,7 @@ renderSuite('should render a div then a component', async () => {
);
});
renderSuite('should process clicks', async () => {
test('should process clicks', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <Counter step={5} />);
@@ -342,7 +340,7 @@ renderSuite('should process clicks', async () => {
);
});
renderSuite('should project no content', async () => {
test('should project no content', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <Project></Project>);
@@ -360,7 +358,7 @@ renderSuite('should project no content', async () => {
);
});
renderSuite('should project un-named slot text', async () => {
test('should project un-named slot text', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <Project>projection</Project>);
@@ -379,7 +377,7 @@ renderSuite('should project un-named slot text', async () => {
);
});
renderSuite('should project un-named slot component', async () => {
test('should project un-named slot component', async () => {
const fixture = new ElementFixture();
await render(
@@ -390,7 +388,7 @@ renderSuite('should project un-named slot component', async () => {
);
});
renderSuite('should render host events on the first element', async () => {
test('should render host events on the first element', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <UseEvents />);
@@ -409,7 +407,7 @@ renderSuite('should render host events on the first element', async () => {
);
});
renderSuite('should project named slot component', async () => {
test('should project named slot component', async () => {
const fixture = new ElementFixture();
await render(
@@ -437,7 +435,7 @@ renderSuite('should project named slot component', async () => {
);
});
renderSuite('should project multiple slot with same name', async () => {
test('should project multiple slot with same name', async () => {
const fixture = new ElementFixture();
await render(
@@ -471,7 +469,7 @@ renderSuite('should project multiple slot with same name', async () => {
`
);
});
renderSuite('should not destroy projection when <Project> reruns', async () => {
test('should not destroy projection when <Project> reruns', async () => {
const fixture = new ElementFixture();
await render(
@@ -491,7 +489,7 @@ renderSuite('should not destroy projection when <Project> reruns', async () => {
);
});
renderSuite('should render into host component', async () => {
test('should render into host component', async () => {
const fixture = new ElementFixture();
await render(
@@ -520,13 +518,13 @@ renderSuite('should render into host component', async () => {
);
});
renderSuite('should render a promise', async () => {
test('should render a promise', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <div>{Promise.resolve('WORKS')}</div>);
await expectRendered(fixture, '<div>WORKS</div>');
});
renderSuite('should render a component with hooks', async () => {
test('should render a component with hooks', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <Hooks />);
@@ -558,15 +556,15 @@ renderSuite('should render a component with hooks', async () => {
);
});
renderSuite('should insert a style', async () => {
test('should insert a style', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <HelloWorld name="World" />);
const style = fixture.document.querySelector(`style[q\\:style]`);
match(style!.textContent!, 'color: red');
assert.include(style!.textContent!, 'color: red');
await expectRendered(fixture, '<span>Hello World</span>');
});
renderSuite('should render #text nodes', async () => {
test('should render #text nodes', async () => {
const fixture = new ElementFixture();
const lines = ['hola', 'adios'];
@@ -595,10 +593,10 @@ renderSuite('should render #text nodes', async () => {
const namespaces = Array.from(fixture.host.querySelectorAll('text')).map(
(e: any) => e.namespaceURI
);
equal(namespaces, ['http://www.w3.org/2000/svg', 'http://www.w3.org/2000/svg']);
assert.deepEqual(namespaces, ['http://www.w3.org/2000/svg', 'http://www.w3.org/2000/svg']);
});
renderSuite('should render class object correctly', async () => {
test('should render class object correctly', async () => {
const fixture = new ElementFixture();
await render(
@@ -614,7 +612,7 @@ renderSuite('should render class object correctly', async () => {
await expectRendered(fixture, `<div class="stuff m-0 p-2"></div>`);
});
renderSuite('should render class array correctly', async () => {
test('should render class array correctly', async () => {
const fixture = new ElementFixture();
await render(
@@ -624,7 +622,7 @@ renderSuite('should render class array correctly', async () => {
await expectRendered(fixture, `<div class="stuff m-0 p-2 active container"></div>`);
});
renderSuite('should re-render classes correctly', async () => {
test('should re-render classes correctly', async () => {
const fixture = new ElementFixture();
await render(fixture.host, <RenderClasses></RenderClasses>);
@@ -655,7 +653,7 @@ renderSuite('should re-render classes correctly', async () => {
);
});
renderSuite('should render camelCase attributes', async () => {
test('should render camelCase attributes', async () => {
const fixture = new ElementFixture();
await render(
@@ -673,7 +671,7 @@ renderSuite('should render camelCase attributes', async () => {
);
});
renderSuite('should render path', async () => {
test('should render path', async () => {
const fixture = new ElementFixture();
await render(
@@ -709,7 +707,7 @@ renderSuite('should render path', async () => {
);
});
renderSuite('should render foreignObject properly', async () => {
test('should render foreignObject properly', async () => {
const fixture = new ElementFixture();
const Text = 'text' as any;
@@ -741,10 +739,10 @@ renderSuite('should render foreignObject properly', async () => {
</div>
);
for (const el of Array.from(fixture.host.querySelectorAll('.is-html'))) {
equal(el.namespaceURI, 'http://www.w3.org/1999/xhtml', el.outerHTML);
assert.equal(el.namespaceURI, 'http://www.w3.org/1999/xhtml', el.outerHTML);
}
for (const el of Array.from(fixture.host.querySelectorAll('.is-svg'))) {
equal(el.namespaceURI, 'http://www.w3.org/2000/svg', el.outerHTML);
assert.equal(el.namespaceURI, 'http://www.w3.org/2000/svg', el.outerHTML);
}
await expectRendered(
@@ -773,22 +771,19 @@ renderSuite('should render foreignObject properly', async () => {
);
});
renderSuite(
'should clean up subscriptions after calling the returned cleanup function',
async () => {
const fixture = new ElementFixture();
test('should clean up subscriptions after calling the returned cleanup function', async () => {
const fixture = new ElementFixture();
const spies = {
cleanupSpy: false,
};
const spies = {
cleanupSpy: false,
};
const { cleanup } = await render(fixture.host, <CleanupComponent spies={spies} />);
const { cleanup } = await render(fixture.host, <CleanupComponent spies={spies} />);
cleanup();
cleanup();
equal(spies.cleanupSpy, true);
}
);
assert.equal(spies.cleanupSpy, true);
});
async function expectRendered(fixture: ElementFixture, expected: string) {
const firstNode = getFirstNode(fixture.host);
@@ -1060,5 +1055,3 @@ export const CleanupComponent = component$((props: { spies: { cleanupSpy: boolea
</div>
);
});
renderSuite.run();

10
packages/qwik/src/core/render/dom/visitor.ts
View File

@@ -1,7 +1,7 @@
import { ELEMENT_ID, OnRenderProp, QSlot, QSlotRef, QSlotS, QStyle } from '../../util/markers';
import { isOnProp, PREVENT_DEFAULT, setEvent } from '../../state/listeners';
import type { ValueOrPromise } from '../../util/types';
import { isPromise, promiseAll, promiseAllLazy, then } from '../../util/promises';
import { isPromise, promiseAll, promiseAllLazy, maybeThen } from '../../util/promises';
import {
assertDefined,
assertElement,
@@ -215,7 +215,7 @@ export const diffChildren = (
elmToMove = oldCh[idxInOld];
if (elmToMove.$type$ !== newStartVnode.$type$) {
const newElm = createElm(ctx, newStartVnode, flags, results);
then(newElm, (newElm) => {
maybeThen(newElm, (newElm) => {
insertBefore(staticCtx, parentElm, newElm, oldStartVnode?.$elm$);
});
} else {
@@ -236,7 +236,7 @@ export const diffChildren = (
let wait = promiseAll(results) as any;
if (oldStartIdx <= oldEndIdx) {
wait = then(wait, () => {
wait = maybeThen(wait, () => {
removeChildren(staticCtx, oldCh, oldStartIdx, oldEndIdx);
});
}
@@ -483,7 +483,7 @@ export const diffVnode = (
// we need to render the nested component, and wait before projecting the content
// since otherwise we don't know where the slots
if (needsRender) {
return then(renderComponent(rCtx, elCtx, flags), () =>
return maybeThen(renderComponent(rCtx, elCtx, flags), () =>
renderContentProjection(rCtx, elCtx, newVnode, flags)
);
}
@@ -765,7 +765,7 @@ const createElm = (
// Run mount hook
elCtx.$componentQrl$ = renderQRL;
const wait = then(renderComponent(rCtx, elCtx, flags), () => {
const wait = maybeThen(renderComponent(rCtx, elCtx, flags), () => {
let children = vnode.$children$;
if (children.length === 0) {
return;

99
packages/qwik/src/core/render/jsx/factory.unit.ts
View File

@@ -1,12 +1,10 @@
import { h } from './factory';
import { isJSXNode, Fragment } from './jsx-runtime';
import type { FunctionComponent } from './types/jsx-node';
import { equal } from 'uvu/assert';
import { suite } from 'uvu';
import { type ProcessedJSXNode, processNode } from '../dom/render-dom';
import { test, assert } from 'vitest';
const jsxSuite = suite('classic jsx factory h()');
jsxSuite('map multiple nodes, flatten', () => {
test('map multiple nodes, flatten', () => {
// <parent>
// a
// {[1, 2].map((n) => (
@@ -23,99 +21,98 @@ jsxSuite('map multiple nodes, flatten', () => {
'b'
)
) as ProcessedJSXNode;
equal(v.$children$.length, 4);
equal(v.$children$[0].$text$, 'a');
equal(v.$children$[1].$type$, 'child');
equal(v.$children$[1].$children$.length, 1);
equal(v.$children$[2].$type$, 'child');
equal(v.$children$[2].$children$.length, 1);
equal(v.$children$[3].$text$, 'b');
assert.deepEqual(v.$children$.length, 4);
assert.deepEqual(v.$children$[0].$text$, 'a');
assert.deepEqual(v.$children$[1].$type$, 'child');
assert.deepEqual(v.$children$[1].$children$.length, 1);
assert.deepEqual(v.$children$[2].$type$, 'child');
assert.deepEqual(v.$children$[2].$children$.length, 1);
assert.deepEqual(v.$children$[3].$text$, 'b');
});
jsxSuite('one child node', () => {
test('one child node', () => {
// <parent><child></child></parent>
const v = processNode(h('parent', null, h('child', null))) as ProcessedJSXNode;
equal(v.$children$.length, 1);
equal(v.$children$[0].$type$, 'child');
equal(v.$children$[0].$props$, {});
equal(v.$children$[0].$children$, []);
assert.deepEqual(v.$children$.length, 1);
assert.deepEqual(v.$children$[0].$type$, 'child');
assert.deepEqual(v.$children$[0].$props$, {});
assert.deepEqual(v.$children$[0].$children$, []);
});
jsxSuite('text w/ expression', () => {
test('text w/ expression', () => {
// <div>1 {2} 3</div>
const v = processNode(h('div', null, '1 ', 2, ' 3')) as ProcessedJSXNode;
equal(v.$children$[0].$type$, '#text');
equal(v.$children$[0].$text$, '1 ');
equal(v.$children$[0].$key$, null);
assert.deepEqual(v.$children$[0].$type$, '#text');
assert.deepEqual(v.$children$[0].$text$, '1 ');
assert.deepEqual(v.$children$[0].$key$, null);
equal(v.$children$[1].$type$, '#text');
equal(v.$children$[1].$text$, '2');
equal(v.$children$[1].$key$, null);
assert.deepEqual(v.$children$[1].$type$, '#text');
assert.deepEqual(v.$children$[1].$text$, '2');
assert.deepEqual(v.$children$[1].$key$, null);
equal(v.$children$[2].$type$, '#text');
equal(v.$children$[2].$text$, ' 3');
equal(v.$children$[2].$key$, null);
assert.deepEqual(v.$children$[2].$type$, '#text');
assert.deepEqual(v.$children$[2].$text$, ' 3');
assert.deepEqual(v.$children$[2].$key$, null);
});
jsxSuite('text child', () => {
test('text child', () => {
// <div>text</div>
const v = processNode(h('div', null, 'text')) as ProcessedJSXNode;
equal(v.$children$[0].$type$, '#text');
equal(v.$children$[0].$text$, 'text');
equal(v.$children$[0].$key$, null);
assert.deepEqual(v.$children$[0].$type$, '#text');
assert.deepEqual(v.$children$[0].$text$, 'text');
assert.deepEqual(v.$children$[0].$key$, null);
});
jsxSuite('no children', () => {
test('no children', () => {
// <div/>
const v = processNode(h('div', null)) as ProcessedJSXNode;
equal(v.$children$, []);
assert.deepEqual(v.$children$, []);
});
jsxSuite('key', () => {
test('key', () => {
// <div key="val"/>
const v = h('div', { key: 'val' });
equal(v.props, {});
equal(v.key, 'val');
assert.deepEqual(v.props, {});
assert.deepEqual(v.key, 'val');
});
jsxSuite('name/value props', () => {
test('name/value props', () => {
// <div id="val"/>
const v = h('div', { id: 'val' });
equal(v.props, { id: 'val' });
assert.deepEqual(v.props, { id: 'val' });
});
jsxSuite('boolean props', () => {
test('boolean props', () => {
// <input checked/>
const v = h('input', { checked: true });
equal(v.props, { checked: true });
assert.deepEqual(v.props, { checked: true });
});
jsxSuite('no props', () => {
test('no props', () => {
// <div/>
const v = h('div', null);
equal(v.props, {});
equal(v.key, null);
assert.deepEqual(v.props, {});
assert.deepEqual(v.key, null);
});
jsxSuite('tag', () => {
test('tag', () => {
const v = h('div', null);
equal(v.type, 'div');
assert.deepEqual(v.type, 'div');
});
jsxSuite('Function Component', () => {
test('Function Component', () => {
const Cmp: FunctionComponent<any> = () => h('fn-cmp', null);
const v = h(Cmp, {});
equal(v.type, Cmp);
assert.deepEqual(v.type, Cmp);
});
jsxSuite('Fragment', () => {
test('Fragment', () => {
// <><div/></>
const v = h(Fragment, null, h('div', null));
equal(v.type, Fragment);
assert.deepEqual(v.type, Fragment);
});
jsxSuite('valid JSXNode', () => {
test('valid JSXNode', () => {
// <div/>
const v = h('div', null);
equal(isJSXNode(v), true);
assert.deepEqual(isJSXNode(v), true);
});
jsxSuite.run();

109
packages/qwik/src/core/render/jsx/jsx-runtime.unit.ts
View File

@@ -1,11 +1,9 @@
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { type ProcessedJSXNode, processNode } from '../dom/render-dom';
import { jsx, isJSXNode, Fragment } from './jsx-runtime';
import type { FunctionComponent } from './types/jsx-node';
const jsxSuite = suite('jsx-runtime');
jsxSuite('map multiple nodes', () => {
test('map multiple nodes', () => {
// <parent>
// {[1,2].map(n => (<child>{n}</child>))}
// </parent>
@@ -14,104 +12,103 @@ jsxSuite('map multiple nodes', () => {
children: [1, 2].map((n) => jsx('child', { children: n })),
})
) as ProcessedJSXNode;
equal(v.$children$.length, 2);
equal(v.$children$[0].$type$, 'child');
equal(v.$children$[1].$type$, 'child');
assert.deepEqual(v.$children$.length, 2);
assert.deepEqual(v.$children$[0].$type$, 'child');
assert.deepEqual(v.$children$[1].$type$, 'child');
});
jsxSuite('one child node', () => {
test('one child node', () => {
// <parent><child></child></parent>
const v = processNode(jsx('parent', { children: jsx('child', {}) })) as ProcessedJSXNode;
equal(v.$children$.length, 1);
equal(v.$children$[0].$type$, 'child');
equal(v.$children$[0].$props$, {});
equal(v.$children$[0].$children$, []);
assert.deepEqual(v.$children$.length, 1);
assert.deepEqual(v.$children$[0].$type$, 'child');
assert.deepEqual(v.$children$[0].$props$, {});
assert.deepEqual(v.$children$[0].$children$, []);
});
jsxSuite('text w/ expression', () => {
test('text w/ expression', () => {
// <div>1 {2} 3</div>
const v = processNode(jsx('div', { children: ['1 ', 2, ' 3'] })) as ProcessedJSXNode;
equal(v.$children$[0].$type$, '#text');
equal(v.$children$[0].$text$, '1 ');
equal(v.$children$[0].$key$, null);
assert.deepEqual(v.$children$[0].$type$, '#text');
assert.deepEqual(v.$children$[0].$text$, '1 ');
assert.deepEqual(v.$children$[0].$key$, null);
equal(v.$children$[1].$type$, '#text');
equal(v.$children$[1].$text$, '2');
equal(v.$children$[1].$key$, null);
assert.deepEqual(v.$children$[1].$type$, '#text');
assert.deepEqual(v.$children$[1].$text$, '2');
assert.deepEqual(v.$children$[1].$key$, null);
equal(v.$children$[2].$type$, '#text');
equal(v.$children$[2].$text$, ' 3');
equal(v.$children$[2].$key$, null);
assert.deepEqual(v.$children$[2].$type$, '#text');
assert.deepEqual(v.$children$[2].$text$, ' 3');
assert.deepEqual(v.$children$[2].$key$, null);
});
jsxSuite('text child', () => {
test('text child', () => {
// <div>text</div>
const v = processNode(jsx('div', { children: 'text' })) as ProcessedJSXNode;
equal(v.$children$[0].$type$, '#text');
equal(v.$children$[0].$text$, 'text');
equal(v.$children$[0].$key$, null);
assert.deepEqual(v.$children$[0].$type$, '#text');
assert.deepEqual(v.$children$[0].$text$, 'text');
assert.deepEqual(v.$children$[0].$key$, null);
});
jsxSuite('no children', () => {
test('no children', () => {
// <div/>
const v = processNode(jsx('div', {})) as ProcessedJSXNode;
equal(v.$children$, []);
assert.deepEqual(v.$children$, []);
});
jsxSuite('key', () => {
test('key', () => {
// <div key="val"/>
const v = jsx('div', {}, 'val');
equal(v.props, {});
equal(v.key, 'val');
assert.deepEqual(v.props, {});
assert.deepEqual(v.key, 'val');
});
jsxSuite('name/value props', () => {
test('name/value props', () => {
// <div id="val"/>
const v = jsx('div', { id: 'val' });
equal(v.props, { id: 'val' });
assert.deepEqual(v.props, { id: 'val' });
});
jsxSuite('boolean props', () => {
test('boolean props', () => {
// <input checked/>
const v = jsx('input', { checked: true });
equal(v.props, { checked: true });
assert.deepEqual(v.props, { checked: true });
});
jsxSuite('no props', () => {
test('no props', () => {
// <div/>
const v = jsx('div', {});
equal(v.props, {});
equal(v.key, null);
assert.deepEqual(v.props, {});
assert.deepEqual(v.key, null);
});
jsxSuite('tag', () => {
test('tag', () => {
const v = jsx('div', {});
equal(v.type, 'div');
assert.deepEqual(v.type, 'div');
});
jsxSuite('Function Component', () => {
test('Function Component', () => {
const Cmp: FunctionComponent<any> = () => jsx('fn-cmp', {});
const v = jsx(Cmp, {});
equal(v.type, Cmp);
assert.deepEqual(v.type, Cmp);
});
jsxSuite('Fragment', () => {
test('Fragment', () => {
const v = jsx(Fragment, {});
equal(v.type, Fragment);
assert.deepEqual(v.type, Fragment);
});
jsxSuite('valid JSXNode', () => {
test('valid JSXNode', () => {
const v = jsx('div', {});
equal(isJSXNode(v), true);
assert.deepEqual(isJSXNode(v), true);
});
jsxSuite('invalid string', () => {
equal(isJSXNode('text'), false);
test('invalid string', () => {
assert.deepEqual(isJSXNode('text'), false);
});
jsxSuite('invalid class', () => {
equal(isJSXNode(class {}), false);
test('invalid class', () => {
assert.deepEqual(isJSXNode(class {}), false);
});
jsxSuite('invalid array', () => {
equal(isJSXNode([]), false);
test('invalid array', () => {
assert.deepEqual(isJSXNode([]), false);
});
jsxSuite('invalid null/undefined', () => {
equal(isJSXNode(null), false);
equal(isJSXNode(undefined), false);
test('invalid null/undefined', () => {
assert.deepEqual(isJSXNode(null), false);
assert.deepEqual(isJSXNode(undefined), false);
});
jsxSuite.run();

16
packages/qwik/src/core/render/ssr/render-ssr.ts
View File

@@ -1,4 +1,4 @@
import { isPromise, then } from '../../util/promises';
import { isPromise, maybeThen } from '../../util/promises';
import { type InvokeContext, newInvokeContext, invoke, trackSignal } from '../../use/use-core';
import { Virtual, _jsxC, _jsxQ, createJSXError, isJSXNode } from '../jsx/jsx-runtime';
import { isArray, isFunction, isString, type ValueOrPromise } from '../../util/types';
@@ -286,7 +286,7 @@ const renderNodeVirtual = (
}
}
const promise = walkChildren(node.children, rCtx, ssrCtx, stream, flags);
return then(promise, () => {
return maybeThen(promise, () => {
// Fast path
if (!isSlot && !beforeClose) {
stream.write(CLOSE_VIRTUAL);
@@ -307,10 +307,10 @@ const renderNodeVirtual = (
}
// Inject before close
if (beforeClose) {
promise = then(promise, () => beforeClose(stream));
promise = maybeThen(promise, () => beforeClose(stream));
}
return then(promise, () => {
return maybeThen(promise, () => {
stream.write(CLOSE_VIRTUAL);
});
});
@@ -376,7 +376,7 @@ const renderSSRComponent = (
): ValueOrPromise<void> => {
const props = node.props;
setComponentProps(rCtx, elCtx, props.props);
return then(executeComponent(rCtx, elCtx), (res) => {
return maybeThen(executeComponent(rCtx, elCtx), (res) => {
const hostElement = elCtx.$element$;
const newRCtx = res.rCtx;
const iCtx = newInvokeContext(ssrCtx.$static$.$locale$, hostElement, undefined);
@@ -457,7 +457,7 @@ const renderSSRComponent = (
renderNodeElementSync('script', attributes, stream);
}
if (beforeClose) {
return then(renderQTemplates(rCtx, newSSrContext, ssrCtx, stream), () =>
return maybeThen(renderQTemplates(rCtx, newSSrContext, ssrCtx, stream), () =>
beforeClose(stream)
);
} else {
@@ -786,7 +786,7 @@ This goes against the HTML spec: https://html.spec.whatwg.org/multipage/dom.html
flags |= IS_IMMUTABLE;
}
const promise = processData(node.children, rCtx, ssrCtx, stream, flags);
return then(promise, () => {
return maybeThen(promise, () => {
// If head inject base styles
if (isHead) {
for (const node of ssrCtx.$static$.$headNodes$) {
@@ -801,7 +801,7 @@ This goes against the HTML spec: https://html.spec.whatwg.org/multipage/dom.html
}
// Inject before close
return then(beforeClose(stream), () => {
return maybeThen(beforeClose(stream), () => {
stream.write(`</${tagName}>`);
});
});

157
packages/qwik/src/core/render/ssr/render-ssr.unit.tsx
View File

@@ -1,6 +1,4 @@
import type { JSXNode } from '@builder.io/qwik/jsx-runtime';
import { suite } from 'uvu';
import { equal, snapshot, unreachable, match } from 'uvu/assert';
import { format } from 'prettier';
import type { StreamWriter } from '../../../server/types';
@@ -19,16 +17,16 @@ import { HTMLFragment, jsx } from '../jsx/jsx-runtime';
import { _renderSSR, type RenderSSROptions } from './render-ssr';
import { useStore } from '../../use/use-store.public';
import { useSignal } from '../../use/use-signal';
import { expect, test, vi } from 'vitest';
const renderSSRSuite = suite('renderSSR');
renderSSRSuite('render attributes', async () => {
test('render attributes', async () => {
await testSSR(
<body id="stuff" aria-required="true" role=""></body>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body id="stuff" aria-required="true" role></body></html>'
);
});
renderSSRSuite('render aria value', async () => {
test('render aria value', async () => {
await testSSR(
<body
id="stuff"
@@ -46,14 +44,14 @@ renderSSRSuite('render aria value', async () => {
);
});
renderSSRSuite('render className', async () => {
test('render className', async () => {
await testSSR(
<body class="stuff"></body>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body class="stuff"></body></html>'
);
});
renderSSRSuite('should not allow div inside p', async () => {
test('should not allow div inside p', async () => {
await throws(async () => {
await testSSR(
<body>
@@ -78,7 +76,7 @@ renderSSRSuite('should not allow div inside p', async () => {
});
});
renderSSRSuite('should not allow button inside button', async () => {
test('should not allow button inside button', async () => {
await throws(async () => {
await testSSR(
<body>
@@ -103,7 +101,7 @@ renderSSRSuite('should not allow button inside button', async () => {
});
});
renderSSRSuite('should not allow a inside a', async () => {
test('should not allow a inside a', async () => {
await throws(async () => {
await testSSR(
<body>
@@ -128,13 +126,13 @@ renderSSRSuite('should not allow a inside a', async () => {
});
});
renderSSRSuite('should not allow div inside html', async () => {
test('should not allow div inside html', async () => {
await throws(async () => {
await testSSR(<div></div>, '');
});
});
renderSSRSuite('should not allow div inside head', async () => {
test('should not allow div inside head', async () => {
await throws(async () => {
await testSSR(
<head>
@@ -145,7 +143,7 @@ renderSSRSuite('should not allow div inside head', async () => {
});
});
renderSSRSuite('render class', async () => {
test('render class', async () => {
await testSSR(
<body
class={{
@@ -185,14 +183,14 @@ renderSSRSuite('render class', async () => {
);
});
renderSSRSuite('render contentEditable', async () => {
test('render contentEditable', async () => {
await testSSR(
<body contentEditable="true"></body>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body contentEditable="true"></body></html>'
);
});
renderSSRSuite('render draggable', async () => {
test('render draggable', async () => {
await testSSR(
<body>
<div draggable={true}></div>
@@ -211,7 +209,7 @@ renderSSRSuite('render draggable', async () => {
);
});
renderSSRSuite('render <textarea>', async () => {
test('render <textarea>', async () => {
await testSSR(
<body>
<textarea value="some text"></textarea>
@@ -226,7 +224,7 @@ renderSSRSuite('render <textarea>', async () => {
);
});
renderSSRSuite('render spellcheck', async () => {
test('render spellcheck', async () => {
await testSSR(
<body>
<div spellcheck={true}></div>
@@ -245,7 +243,7 @@ renderSSRSuite('render spellcheck', async () => {
);
});
renderSSRSuite('render styles', async () => {
test('render styles', async () => {
await testSSR(
<body
style={{
@@ -272,7 +270,7 @@ renderSSRSuite('render styles', async () => {
);
});
renderSSRSuite('render fake click handler', async () => {
test('render fake click handler', async () => {
const Div = 'body' as any;
await testSSR(
<Div on:click="true" onScroll="text"></Div>,
@@ -282,7 +280,7 @@ renderSSRSuite('render fake click handler', async () => {
);
});
renderSSRSuite('self closing elements', async () => {
test('self closing elements', async () => {
await testSSR(
<body>
<input></input>
@@ -295,7 +293,7 @@ renderSSRSuite('self closing elements', async () => {
);
});
renderSSRSuite('single simple children', async () => {
test('single simple children', async () => {
await testSSR(
<body>hola</body>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body>hola</body></html>'
@@ -322,7 +320,7 @@ renderSSRSuite('single simple children', async () => {
);
});
renderSSRSuite('valid phrasing content', async () => {
test('valid phrasing content', async () => {
await testSSR(
<body>
<p>
@@ -426,7 +424,7 @@ renderSSRSuite('valid phrasing content', async () => {
);
});
renderSSRSuite('events', async () => {
test('events', async () => {
await testSSR(
<body onClick$={() => console.warn('hol')}>hola</body>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body on:click="/runtimeQRL#_">hola</body></html>'
@@ -455,19 +453,19 @@ renderSSRSuite('events', async () => {
);
});
renderSSRSuite('innerHTML', async () => {
test('innerHTML', async () => {
await testSSR(
<body dangerouslySetInnerHTML="<p>hola</p>"></body>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body q:key="innerhtml"><p>hola</p></body></html>'
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body><p>hola</p></body></html>'
);
await testSSR(
<body dangerouslySetInnerHTML=""></body>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body q:key="innerhtml"></body></html>'
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body></body></html>'
);
const Div = 'body' as any;
await testSSR(
<Div dangerouslySetInnerHTML={0}></Div>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body q:key="innerhtml">0</body></html>'
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body>0</body></html>'
);
await testSSR(
<body>
@@ -475,7 +473,7 @@ renderSSRSuite('innerHTML', async () => {
</body>,
`<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test">
<body>
<script q:key="innerhtml">
<script>
() => null
</script>
</body>
@@ -483,7 +481,7 @@ renderSSRSuite('innerHTML', async () => {
);
});
renderSSRSuite('single complex children', async () => {
test('single complex children', async () => {
await testSSR(
<div>
<p>hola</p>
@@ -505,7 +503,7 @@ renderSSRSuite('single complex children', async () => {
);
});
renderSSRSuite('single multiple children', async () => {
test('single multiple children', async () => {
await testSSR(
<ul>
<li>1</li>
@@ -524,7 +522,7 @@ renderSSRSuite('single multiple children', async () => {
);
});
renderSSRSuite('sanity', async () => {
test('sanity', async () => {
await testSSR(
<body>
<div>{`.rule > thing{}`}</div>
@@ -537,7 +535,7 @@ renderSSRSuite('sanity', async () => {
);
});
renderSSRSuite('using fragment', async () => {
test('using fragment', async () => {
await testSSR(
<ul>
<>
@@ -566,7 +564,7 @@ renderSSRSuite('using fragment', async () => {
);
});
renderSSRSuite('using promises', async () => {
test('using promises', async () => {
await testSSR(
<body>{Promise.resolve('hola')}</body>,
'<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test"><body><!--qkssr-f-->hola</body></html>'
@@ -614,7 +612,7 @@ renderSSRSuite('using promises', async () => {
);
});
renderSSRSuite('mixed children', async () => {
test('mixed children', async () => {
await testSSR(
<ul>
<li>0</li>
@@ -650,7 +648,7 @@ renderSSRSuite('mixed children', async () => {
);
});
renderSSRSuite('DelayResource', async () => {
test('DelayResource', async () => {
await testSSR(
<body>
<ul>
@@ -674,7 +672,7 @@ renderSSRSuite('DelayResource', async () => {
);
});
renderSSRSuite('using promises with DelayResource', async () => {
test('using promises with DelayResource', async () => {
await testSSR(
<body>
<ul>
@@ -699,7 +697,7 @@ renderSSRSuite('using promises with DelayResource', async () => {
);
});
renderSSRSuite('using component', async () => {
test('using component', async () => {
await testSSR(
<MyCmp />,
`<container q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test" class="qc📦">
@@ -713,7 +711,7 @@ renderSSRSuite('using component', async () => {
);
});
renderSSRSuite('using component with key', async () => {
test('using component with key', async () => {
await testSSR(
<body>
<MyCmp key="hola" />
@@ -728,7 +726,7 @@ renderSSRSuite('using component with key', async () => {
);
});
renderSSRSuite('using element with key', async () => {
test('using element with key', async () => {
await testSSR(
<body>
<div key="hola" />
@@ -741,7 +739,7 @@ renderSSRSuite('using element with key', async () => {
);
});
renderSSRSuite('using element with key containing double quotes', async () => {
test('using element with key containing double quotes', async () => {
await testSSR(
<body>
<div key={'"hola"'} />
@@ -754,7 +752,7 @@ renderSSRSuite('using element with key containing double quotes', async () => {
);
});
renderSSRSuite('using component props', async () => {
test('using component props', async () => {
await testSSR(
<MyCmp
id="12"
@@ -783,7 +781,7 @@ renderSSRSuite('using component props', async () => {
);
});
renderSSRSuite('using component project content', async () => {
test('using component project content', async () => {
await testSSR(
<MyCmp>
<div>slot</div>
@@ -802,7 +800,7 @@ renderSSRSuite('using component project content', async () => {
);
});
renderSSRSuite('using complex component', async () => {
test('using complex component', async () => {
await testSSR(
<body>
<MyCmpComplex></MyCmpComplex>
@@ -820,7 +818,7 @@ renderSSRSuite('using complex component', async () => {
);
});
renderSSRSuite('using complex component with slot', async () => {
test('using complex component with slot', async () => {
await testSSR(
<MyCmpComplex>Hola</MyCmpComplex>,
`
@@ -840,7 +838,7 @@ renderSSRSuite('using complex component with slot', async () => {
);
});
renderSSRSuite('<head>', async () => {
test('<head>', async () => {
await testSSR(
<head>
<title>hola</title>
@@ -858,7 +856,7 @@ renderSSRSuite('<head>', async () => {
);
});
renderSSRSuite('named slots', async () => {
test('named slots', async () => {
await testSSR(
<NamedSlot>
Text
@@ -894,7 +892,7 @@ renderSSRSuite('named slots', async () => {
);
});
renderSSRSuite('nested slots', async () => {
test('nested slots', async () => {
await testSSR(
<SimpleSlot name="root">
<SimpleSlot name="level 1">
@@ -941,7 +939,7 @@ renderSSRSuite('nested slots', async () => {
);
});
renderSSRSuite('mixes slots', async () => {
test('mixes slots', async () => {
await testSSR(
<MixedSlot>Content</MixedSlot>,
`
@@ -965,7 +963,8 @@ renderSSRSuite('mixes slots', async () => {
);
});
renderSSRSuite('component RenderSignals()', async () => {
test('component RenderSignals()', async () => {
vi.spyOn(console, 'warn');
await testSSR(
<RenderSignals />,
`
@@ -983,9 +982,10 @@ renderSSRSuite('component RenderSignals()', async () => {
<!--/qv-->
</html>`
);
expect(console.warn).toHaveBeenCalledTimes(2);
});
renderSSRSuite('component useContextProvider()', async () => {
test('component useContextProvider()', async () => {
await testSSR(
<Context>
<ContextConsumer />
@@ -1001,7 +1001,7 @@ renderSSRSuite('component useContextProvider()', async () => {
);
});
renderSSRSuite('component useContextProvider() + useContext()', async () => {
test('component useContextProvider() + useContext()', async () => {
await testSSR(
<ContextWithValueAndUse value="hello bye" />,
`<html q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test">
@@ -1010,7 +1010,7 @@ renderSSRSuite('component useContextProvider() + useContext()', async () => {
);
});
renderSSRSuite('component slotted context', async () => {
test('component slotted context', async () => {
await testSSR(
<body>
<VariadicContext>
@@ -1056,7 +1056,7 @@ renderSSRSuite('component slotted context', async () => {
);
});
renderSSRSuite('component useOn()', async () => {
test('component useOn()', async () => {
await testSSR(
<body>
<Events />
@@ -1071,7 +1071,7 @@ renderSSRSuite('component useOn()', async () => {
);
});
renderSSRSuite('component useOn([array])', async () => {
test('component useOn([array])', async () => {
await testSSR(
<body>
<UseOnMultiple />
@@ -1093,7 +1093,7 @@ renderSSRSuite('component useOn([array])', async () => {
);
});
renderSSRSuite('component useStyles()', async () => {
test('component useStyles()', async () => {
await testSSR(
<>
<body>
@@ -1113,7 +1113,7 @@ renderSSRSuite('component useStyles()', async () => {
);
});
renderSSRSuite('component useStylesScoped()', async () => {
test('component useStylesScoped()', async () => {
await testSSR(
<>
<body>
@@ -1173,7 +1173,7 @@ renderSSRSuite('component useStylesScoped()', async () => {
);
});
renderSSRSuite('component useStylesScoped() + slot', async () => {
test('component useStylesScoped() + slot', async () => {
await testSSR(
<>
<RootStyles></RootStyles>
@@ -1204,7 +1204,7 @@ renderSSRSuite('component useStylesScoped() + slot', async () => {
);
});
renderSSRSuite('component useBrowserVisibleTask()', async () => {
test('component useBrowserVisibleTask()', async () => {
await testSSR(
<UseClientEffect />,
`<container q:container="paused" q:version="dev" q:render="ssr-dev" q:manifest-hash="test" class="qc📦">
@@ -1219,7 +1219,7 @@ renderSSRSuite('component useBrowserVisibleTask()', async () => {
);
});
renderSSRSuite('component useBrowserVisibleTask() without elements', async () => {
test('component useBrowserVisibleTask() without elements', async () => {
await testSSR(
<body>
<UseEmptyClientEffect />
@@ -1237,7 +1237,7 @@ renderSSRSuite('component useBrowserVisibleTask() without elements', async () =>
);
});
renderSSRSuite('component useBrowserVisibleTask() inside <head>', async () => {
test('component useBrowserVisibleTask() inside <head>', async () => {
await testSSR(
<head>
<UseEmptyClientEffect />
@@ -1258,7 +1258,7 @@ renderSSRSuite('component useBrowserVisibleTask() inside <head>', async () => {
);
});
renderSSRSuite('nested html', async () => {
test('nested html', async () => {
await testSSR(
<>
<body></body>
@@ -1267,7 +1267,7 @@ renderSSRSuite('nested html', async () => {
);
});
renderSSRSuite('root html component', async () => {
test('root html component', async () => {
await testSSR(
<HeadCmp host:aria-hidden="true">
<link></link>
@@ -1287,7 +1287,7 @@ renderSSRSuite('root html component', async () => {
);
});
renderSSRSuite('containerTagName', async () => {
test('containerTagName', async () => {
await testSSR(
<>
<Styles />
@@ -1314,7 +1314,7 @@ renderSSRSuite('containerTagName', async () => {
);
});
renderSSRSuite('containerAttributes', async () => {
test('containerAttributes', async () => {
await testSSR(
<>
<body></body>
@@ -1349,7 +1349,7 @@ renderSSRSuite('containerAttributes', async () => {
);
});
renderSSRSuite('custom q:render', async () => {
test('custom q:render', async () => {
await testSSR(
<>
<body></body>
@@ -1382,7 +1382,7 @@ renderSSRSuite('custom q:render', async () => {
);
});
renderSSRSuite('ssr marks', async () => {
test('ssr marks', async () => {
await testSSR(
<body>
{delay(100).then(() => (
@@ -1416,7 +1416,7 @@ renderSSRSuite('ssr marks', async () => {
);
});
renderSSRSuite('ssr raw', async () => {
test('ssr raw', async () => {
await testSSR(
<body>
<SSRRaw data="<div>hello</div>" />
@@ -1430,7 +1430,7 @@ renderSSRSuite('ssr raw', async () => {
);
});
renderSSRSuite('html fragment', async () => {
test('html fragment', async () => {
await testSSR(
<body>
<HTMLFragment dangerouslySetInnerHTML="<div>hello</div>" />
@@ -1446,7 +1446,7 @@ renderSSRSuite('html fragment', async () => {
);
});
renderSSRSuite('html slot', async () => {
test('html slot', async () => {
await testSSR(
<HtmlContext>
<head>
@@ -1484,7 +1484,7 @@ renderSSRSuite('html slot', async () => {
);
});
renderSSRSuite('null component', async () => {
test('null component', async () => {
await testSSR(
<>
<NullCmp />
@@ -1493,7 +1493,7 @@ renderSSRSuite('null component', async () => {
);
});
renderSSRSuite('cleanse attribute name', async () => {
test('cleanse attribute name', async () => {
const o = {
'"><script>alert("ಠ~ಠ")</script>': 'xss',
};
@@ -1503,7 +1503,7 @@ renderSSRSuite('cleanse attribute name', async () => {
);
});
renderSSRSuite('cleanse class attribute', async () => {
test('cleanse class attribute', async () => {
const o = {
class: '"><script>alert("ಠ~ಠ")</script>',
};
@@ -1513,7 +1513,7 @@ renderSSRSuite('cleanse class attribute', async () => {
);
});
renderSSRSuite('class emoji valid', async () => {
test('class emoji valid', async () => {
const o = {
class: 'package📦',
};
@@ -1523,7 +1523,7 @@ renderSSRSuite('class emoji valid', async () => {
);
});
renderSSRSuite('issue 4283', async () => {
test('issue 4283', async () => {
await testSSR(
<body>
<Issue4283>
@@ -1560,8 +1560,6 @@ renderSSRSuite('issue 4283', async () => {
// SVG rendering
// Performance metrics
renderSSRSuite.run();
export const MyCmp = component$((props: Record<string, any>) => {
return (
<section>
@@ -1860,12 +1858,11 @@ async function testSSR(
});
if (typeof expected === 'string') {
const options = { parser: 'html', htmlWhitespaceSensitivity: 'ignore' } as const;
snapshot(
await format(chunks.join(''), options),
expect(await format(chunks.join(''), options)).toBe(
await format(expected.replace(/(\n|^)\s+/gm, ''), options)
);
} else {
equal(chunks, expected);
expect(chunks).toEqual(expected);
}
}
@@ -1941,10 +1938,10 @@ export const Issue4283 = component$(() => {
async function throws<T>(fn: () => T, expected?: string | RegExp): Promise<void> {
try {
await fn();
unreachable('Expression should throw');
expect.unreachable('Expression should throw');
} catch (e) {
if (expected) {
match(String(e), expected);
expect(String(e)).toBe(expected);
}
}
}

276
packages/qwik/src/core/style/scoped-stylesheet.unit.ts
View File

@@ -1,109 +1,112 @@
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { scopeStylesheet } from './scoped-stylesheet';
const scopedStyles = suite('scopedStyles');
test('selectors', () => {
assert.equal(scopeStylesheet('div {}', '_'), 'div.⭐️_ {}');
assert.equal(scopeStylesheet('div {}div{} div {}', '_'), 'div.⭐️_ {}div.⭐️_{} div.⭐️_ {}');
assert.equal(scopeStylesheet('div, p {}', '_'), 'div.⭐️_, p.⭐️_ {}');
scopedStyles('selectors', () => {
equal(scopeStylesheet('div {}', '_'), 'div.⭐️_ {}');
equal(scopeStylesheet('div {}div{} div {}', '_'), 'div.⭐️_ {}div.⭐️_{} div.⭐️_ {}');
equal(scopeStylesheet('div, p {}', '_'), 'div.⭐️_, p.⭐️_ {}');
assert.equal(scopeStylesheet('div p {}', '_'), 'div.⭐️_ p.⭐️_ {}');
assert.equal(scopeStylesheet('div > p {}', '_'), 'div.⭐️_ > p.⭐️_ {}');
assert.equal(scopeStylesheet('div + p {}', '_'), 'div.⭐️_ + p.⭐️_ {}');
assert.equal(scopeStylesheet('div ~ p {}', '_'), 'div.⭐️_ ~ p.⭐️_ {}');
equal(scopeStylesheet('div p {}', '_'), 'div.⭐️_ p.⭐️_ {}');
equal(scopeStylesheet('div > p {}', '_'), 'div.⭐️_ > p.⭐️_ {}');
equal(scopeStylesheet('div + p {}', '_'), 'div.⭐️_ + p.⭐️_ {}');
equal(scopeStylesheet('div ~ p {}', '_'), 'div.⭐️_ ~ p.⭐️_ {}');
equal(scopeStylesheet('.red {}', '_'), '.red.⭐️_ {}');
equal(scopeStylesheet('div.red {}', '_'), 'div.red.⭐️_ {}');
assert.equal(scopeStylesheet('.red {}', '_'), '.red.⭐️_ {}');
assert.equal(scopeStylesheet('div.red {}', '_'), 'div.red.⭐️_ {}');
});
scopedStyles('unicode', () => {
equal(scopeStylesheet('.miško{}', '_'), '.miško.⭐️_{}');
test('unicode', () => {
assert.equal(scopeStylesheet('.miško{}', '_'), '.miško.⭐️_{}');
});
scopedStyles('selectors with *', () => {
equal(scopeStylesheet('* {}', '_'), '.⭐️_ {}');
equal(scopeStylesheet('.red * {}', '_'), '.red.⭐️_ .⭐️_ {}');
equal(scopeStylesheet('#red * {}', '_'), '#red.⭐️_ .⭐️_ {}');
test('selectors with *', () => {
assert.equal(scopeStylesheet('* {}', '_'), '.⭐️_ {}');
assert.equal(scopeStylesheet('.red * {}', '_'), '.red.⭐️_ .⭐️_ {}');
assert.equal(scopeStylesheet('#red * {}', '_'), '#red.⭐️_ .⭐️_ {}');
});
scopedStyles('selectors with chains', () => {
equal(scopeStylesheet('.red.text {}', '_'), '.red.text.⭐️_ {}');
test('selectors with chains', () => {
assert.equal(scopeStylesheet('.red.text {}', '_'), '.red.text.⭐️_ {}');
equal(scopeStylesheet('#red {}', '_'), '#red.⭐️_ {}');
equal(scopeStylesheet('div#red {}', '_'), 'div#red.⭐️_ {}');
assert.equal(scopeStylesheet('#red {}', '_'), '#red.⭐️_ {}');
assert.equal(scopeStylesheet('div#red {}', '_'), 'div#red.⭐️_ {}');
equal(scopeStylesheet('div { }', '_'), 'div.⭐️_ { }');
equal(scopeStylesheet('div {}', '_'), 'div.⭐️_ {}');
equal(
assert.equal(scopeStylesheet('div { }', '_'), 'div.⭐️_ { }');
assert.equal(scopeStylesheet('div {}', '_'), 'div.⭐️_ {}');
assert.equal(
scopeStylesheet('div {background-color: blue; }', '_'),
'div.⭐️_ {background-color: blue; }'
);
equal(
assert.equal(
scopeStylesheet('div { color: red !important; }', '_'),
'div.⭐️_ { color: red !important; }'
);
equal(scopeStylesheet('div{color:red;}', '_'), 'div.⭐️_{color:red;}');
equal(scopeStylesheet('div { content: "}"; }', '_'), 'div.⭐️_ { content: "}"; }');
equal(scopeStylesheet("div { content: '}'; }", '_'), "div.⭐️_ { content: '}'; }");
assert.equal(scopeStylesheet('div{color:red;}', '_'), 'div.⭐️_{color:red;}');
assert.equal(scopeStylesheet('div { content: "}"; }', '_'), 'div.⭐️_ { content: "}"; }');
assert.equal(scopeStylesheet("div { content: '}'; }", '_'), "div.⭐️_ { content: '}'; }");
});
scopedStyles('attribute selectors', () => {
equal(scopeStylesheet('*[a]{}', '_'), '[a].⭐️_{}');
equal(scopeStylesheet('*[a] {}', '_'), '[a].⭐️_ {}');
equal(scopeStylesheet('*[target] span {}', '_'), '[target].⭐️_ span.⭐️_ {}');
test('attribute selectors', () => {
assert.equal(scopeStylesheet('*[a]{}', '_'), '[a].⭐️_{}');
assert.equal(scopeStylesheet('*[a] {}', '_'), '[a].⭐️_ {}');
assert.equal(scopeStylesheet('*[target] span {}', '_'), '[target].⭐️_ span.⭐️_ {}');
equal(scopeStylesheet('a[target] {}', '_'), 'a[target].⭐️_ {}');
equal(scopeStylesheet('a[target="_blank"] {}', '_'), 'a[target="_blank"].⭐️_ {}');
equal(scopeStylesheet('input[type="button"] {}', '_'), 'input[type="button"].⭐️_ {}');
assert.equal(scopeStylesheet('a[target] {}', '_'), 'a[target].⭐️_ {}');
assert.equal(scopeStylesheet('a[target="_blank"] {}', '_'), 'a[target="_blank"].⭐️_ {}');
assert.equal(scopeStylesheet('input[type="button"] {}', '_'), 'input[type="button"].⭐️_ {}');
equal(scopeStylesheet('a[title~="red"] {}', '_'), 'a[title~="red"].⭐️_ {}');
equal(scopeStylesheet('a[class^="red"] {}', '_'), 'a[class^="red"].⭐️_ {}');
equal(scopeStylesheet('a[class|="red"] {}', '_'), 'a[class|="red"].⭐️_ {}');
equal(scopeStylesheet('a[class*="red"] {}', '_'), 'a[class*="red"].⭐️_ {}');
equal(scopeStylesheet('a[class$="red"] {}', '_'), 'a[class$="red"].⭐️_ {}');
assert.equal(scopeStylesheet('a[title~="red"] {}', '_'), 'a[title~="red"].⭐️_ {}');
assert.equal(scopeStylesheet('a[class^="red"] {}', '_'), 'a[class^="red"].⭐️_ {}');
assert.equal(scopeStylesheet('a[class|="red"] {}', '_'), 'a[class|="red"].⭐️_ {}');
assert.equal(scopeStylesheet('a[class*="red"] {}', '_'), 'a[class*="red"].⭐️_ {}');
assert.equal(scopeStylesheet('a[class$="red"] {}', '_'), 'a[class$="red"].⭐️_ {}');
});
scopedStyles('pseudo classes', () => {
equal(scopeStylesheet('p:lang(en) {}', '_'), 'p:lang(en).⭐️_ {}');
equal(scopeStylesheet('a:link {}', '_'), 'a:link.⭐️_ {}');
equal(scopeStylesheet('p:nth-child(2) {}', '_'), 'p:nth-child(2).⭐️_ {}');
equal(scopeStylesheet('p:nth-child(3n+1) {}', '_'), 'p:nth-child(3n+1).⭐️_ {}');
test('pseudo classes', () => {
assert.equal(scopeStylesheet('p:lang(en) {}', '_'), 'p:lang(en).⭐️_ {}');
assert.equal(scopeStylesheet('a:link {}', '_'), 'a:link.⭐️_ {}');
assert.equal(scopeStylesheet('p:nth-child(2) {}', '_'), 'p:nth-child(2).⭐️_ {}');
assert.equal(scopeStylesheet('p:nth-child(3n+1) {}', '_'), 'p:nth-child(3n+1).⭐️_ {}');
});
scopedStyles('pseudo classes without selector', () => {
equal(scopeStylesheet(':root {}', '_'), ':root.⭐️_ {}');
test('pseudo classes without selector', () => {
assert.equal(scopeStylesheet(':root {}', '_'), ':root.⭐️_ {}');
});
scopedStyles('pseudo selector with negation', () => {
equal(scopeStylesheet('p:not(.blue) {}', '_'), 'p:not(.blue.⭐️_).⭐️_ {}');
test('pseudo selector with negation', () => {
assert.equal(scopeStylesheet('p:not(.blue) {}', '_'), 'p:not(.blue.⭐️_).⭐️_ {}');
});
scopedStyles('pseudo selector with :nth', () => {
equal(scopeStylesheet('p:nth-child(3n+1):hover {}', '_'), 'p:nth-child(3n+1):hover.⭐️_ {}');
equal(scopeStylesheet('p:nth-child(3n+1) div {}', '_'), 'p:nth-child(3n+1).⭐️_ div.⭐️_ {}');
test('pseudo selector with :nth', () => {
assert.equal(
scopeStylesheet('p:nth-child(3n+1):hover {}', '_'),
'p:nth-child(3n+1):hover.⭐️_ {}'
);
assert.equal(
scopeStylesheet('p:nth-child(3n+1) div {}', '_'),
'p:nth-child(3n+1).⭐️_ div.⭐️_ {}'
);
});
scopedStyles('pseudo elements', () => {
equal(scopeStylesheet('::selection {}', '_'), '.⭐️_::selection {}');
equal(scopeStylesheet(' ::space {}', '_'), ' .⭐️_::space {}');
test('pseudo elements', () => {
assert.equal(scopeStylesheet('::selection {}', '_'), '.⭐️_::selection {}');
assert.equal(scopeStylesheet(' ::space {}', '_'), ' .⭐️_::space {}');
equal(scopeStylesheet('a::before {}', '_'), 'a.⭐️_::before {}');
equal(scopeStylesheet('a::after {}', '_'), 'a.⭐️_::after {}');
assert.equal(scopeStylesheet('a::before {}', '_'), 'a.⭐️_::before {}');
assert.equal(scopeStylesheet('a::after {}', '_'), 'a.⭐️_::after {}');
equal(scopeStylesheet('a::first-line {}', '_'), 'a.⭐️_::first-line {}');
assert.equal(scopeStylesheet('a::first-line {}', '_'), 'a.⭐️_::first-line {}');
equal(scopeStylesheet('a.red::before {}', '_'), 'a.red.⭐️_::before {}');
equal(scopeStylesheet('a.red span::before {}', '_'), 'a.red.⭐️_ span.⭐️_::before {}');
assert.equal(scopeStylesheet('a.red::before {}', '_'), 'a.red.⭐️_::before {}');
assert.equal(scopeStylesheet('a.red span::before {}', '_'), 'a.red.⭐️_ span.⭐️_::before {}');
['before', 'after', 'first-letter', 'first-line'].forEach((selector) => {
equal(scopeStylesheet(`:${selector} {}`, '_'), `.⭐️_:${selector} {}`);
equal(scopeStylesheet(`a:${selector} {}`, '_'), `a.⭐️_:${selector} {}`);
assert.equal(scopeStylesheet(`:${selector} {}`, '_'), `.⭐️_:${selector} {}`);
assert.equal(scopeStylesheet(`a:${selector} {}`, '_'), `a.⭐️_:${selector} {}`);
});
});
scopedStyles('complex properties', () => {
equal(
test('complex properties', () => {
assert.equal(
scopeStylesheet('div { background: #D0E4F5 url("./bg.jpg") no-repeat scroll 0 0; }', '_'),
'div.⭐️_ { background: #D0E4F5 url("./bg.jpg") no-repeat scroll 0 0; }'
);
equal(
assert.equal(
scopeStylesheet(
'div { background: -webkit-linear-gradient(left, #1C6EA4 0%, #2388CB 50%, #144E75 100%); }',
'_'
@@ -112,27 +115,27 @@ scopedStyles('complex properties', () => {
);
});
scopedStyles('@keyframe', () => {
equal(
test('@keyframe', () => {
assert.equal(
scopeStylesheet('@keyframes slidein {from{b:c(0%);}to{b:c(0%);}}', '_'),
'@keyframes slidein {from{b:c(0%);}to{b:c(0%);}}'
);
equal(
assert.equal(
scopeStylesheet('@-prefix-keyframes slidein {from{b:c(0%);}to{b:c(0%);}}', '_'),
'@-prefix-keyframes slidein {from{b:c(0%);}to{b:c(0%);}}'
);
});
scopedStyles('animation-name', () => {
equal(scopeStylesheet('p{animation-name: x}', '_'), 'p.⭐️_{animation-name: x}');
test('animation-name', () => {
assert.equal(scopeStylesheet('p{animation-name: x}', '_'), 'p.⭐️_{animation-name: x}');
});
scopedStyles('animation', () => {
equal(scopeStylesheet('p{animation: a b c }', '_'), 'p.⭐️_{animation: a b c }');
test('animation', () => {
assert.equal(scopeStylesheet('p{animation: a b c }', '_'), 'p.⭐️_{animation: a b c }');
});
scopedStyles('@font-face', () => {
equal(
test('@font-face', () => {
assert.equal(
scopeStylesheet(
'@font-face { font-family: "Open Sans"; src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("/fonts/OpenSans-Regular-webfont.woff") format("woff"); }',
'_'
@@ -141,15 +144,15 @@ scopedStyles('@font-face', () => {
);
});
scopedStyles('@media', () => {
equal(
test('@media', () => {
assert.equal(
scopeStylesheet('@media screen and (min-width: 900px) { div {} }', '_'),
'@media screen and (min-width: 900px) { div.⭐️_ {} }'
);
});
scopedStyles('@supports', () => {
equal(
test('@supports', () => {
assert.equal(
scopeStylesheet(
'@supports (display: flex) { @media screen and (min-width: 900px) { div {} } }',
'_'
@@ -158,24 +161,24 @@ scopedStyles('@supports', () => {
);
});
scopedStyles('@supports nested', () => {
equal(scopeStylesheet('@media screen(a:1){}div{}', '_'), '@media screen(a:1){}div.⭐️_{}');
test('@supports nested', () => {
assert.equal(scopeStylesheet('@media screen(a:1){}div{}', '_'), '@media screen(a:1){}div.⭐️_{}');
equal(
assert.equal(
scopeStylesheet('@supports(d:b){div{}@media screen(a:1){div{}}div{}}', '_'),
'@supports(d:b){div.⭐️_{}@media screen(a:1){div.⭐️_{}}div.⭐️_{}}'
);
equal(
assert.equal(
scopeStylesheet('@supports not (not (transform-origin: 2px)) { div {} }', '_'),
'@supports not (not (transform-origin: 2px)) { div.⭐️_ {} }'
);
equal(
assert.equal(
scopeStylesheet('@supports (display: grid) and (not (display: inline-grid)) { div {} }', '_'),
'@supports (display: grid) and (not (display: inline-grid)) { div.⭐️_ {} }'
);
equal(
assert.equal(
scopeStylesheet(
'@supports ((perspective: 10px) or (-moz-perspective: 10px) or (-webkit-perspective: 10px) or (-ms-perspective: 10px) or (-o-perspective: 10px)) { div {} }',
'_'
@@ -184,80 +187,87 @@ scopedStyles('@supports nested', () => {
);
});
scopedStyles('comments', () => {
equal(scopeStylesheet('div {} /* comment */', '_'), 'div.⭐️_ {} /* comment */');
equal(scopeStylesheet('div { /**/ }', '_'), 'div.⭐️_ { /**/ }');
equal(scopeStylesheet('div /* comment */ {}', '_'), 'div.⭐️_ /* comment */ {}');
equal(scopeStylesheet('div/* comment */ {}', '_'), 'div.⭐️_/* comment */ {}');
equal(scopeStylesheet('/* comment */div {}', '_'), '/* comment */div.⭐️_ {}');
equal(
test('comments', () => {
assert.equal(scopeStylesheet('div {} /* comment */', '_'), 'div.⭐️_ {} /* comment */');
assert.equal(scopeStylesheet('div { /**/ }', '_'), 'div.⭐️_ { /**/ }');
assert.equal(scopeStylesheet('div /* comment */ {}', '_'), 'div.⭐️_ /* comment */ {}');
assert.equal(scopeStylesheet('div/* comment */ {}', '_'), 'div.⭐️_/* comment */ {}');
assert.equal(scopeStylesheet('/* comment */div {}', '_'), '/* comment */div.⭐️_ {}');
assert.equal(
scopeStylesheet('div /* comment */ > span {}', '_'),
'div.⭐️_ /* comment */ > span.⭐️_ {}'
);
});
scopedStyles('global selector', () => {
equal(scopeStylesheet(':global(*) {}', '_'), '* {}');
test('global selector', () => {
assert.equal(scopeStylesheet(':global(*) {}', '_'), '* {}');
});
scopedStyles('global selector with attribute', () => {
equal(scopeStylesheet(':global([t="("]) {}', '_'), '[t="("] {}');
test('global selector with attribute', () => {
assert.equal(scopeStylesheet(':global([t="("]) {}', '_'), '[t="("] {}');
equal(scopeStylesheet(':global(div) {}', '_'), 'div {}');
equal(scopeStylesheet(':global(div), p {}', '_'), 'div, p.⭐️_ {}');
assert.equal(scopeStylesheet(':global(div) {}', '_'), 'div {}');
assert.equal(scopeStylesheet(':global(div), p {}', '_'), 'div, p.⭐️_ {}');
equal(scopeStylesheet('div :global(p) {}', '_'), 'div.⭐️_ p {}');
equal(scopeStylesheet(':global(div) > p {}', '_'), 'div > p.⭐️_ {}');
assert.equal(scopeStylesheet('div :global(p) {}', '_'), 'div.⭐️_ p {}');
assert.equal(scopeStylesheet(':global(div) > p {}', '_'), 'div > p.⭐️_ {}');
equal(scopeStylesheet(':global(.red) {}', '_'), '.red {}');
equal(scopeStylesheet(':global(div).red {}', '_'), 'div.red.⭐️_ {}');
equal(scopeStylesheet(':global(div.red) {}', '_'), 'div.red {}');
assert.equal(scopeStylesheet(':global(.red) {}', '_'), '.red {}');
assert.equal(scopeStylesheet(':global(div).red {}', '_'), 'div.red.⭐️_ {}');
assert.equal(scopeStylesheet(':global(div.red) {}', '_'), 'div.red {}');
equal(scopeStylesheet(':global(#red) {}', '_'), '#red {}');
assert.equal(scopeStylesheet(':global(#red) {}', '_'), '#red {}');
equal(scopeStylesheet(':global(div) { }', '_'), 'div { }');
equal(scopeStylesheet(':global(div) {}', '_'), 'div {}');
equal(scopeStylesheet(':global(div){color:red;}', '_'), 'div{color:red;}');
assert.equal(scopeStylesheet(':global(div) { }', '_'), 'div { }');
assert.equal(scopeStylesheet(':global(div) {}', '_'), 'div {}');
assert.equal(scopeStylesheet(':global(div){color:red;}', '_'), 'div{color:red;}');
equal(scopeStylesheet(':global(*[target]) {}', '_'), '*[target] {}');
equal(scopeStylesheet(':global(*[target]) span {}', '_'), '*[target] span.⭐️_ {}');
equal(scopeStylesheet('*[target] :global(span) {}', '_'), '[target].⭐️_ span {}');
assert.equal(scopeStylesheet(':global(*[target]) {}', '_'), '*[target] {}');
assert.equal(scopeStylesheet(':global(*[target]) span {}', '_'), '*[target] span.⭐️_ {}');
assert.equal(scopeStylesheet('*[target] :global(span) {}', '_'), '[target].⭐️_ span {}');
equal(scopeStylesheet(':global(a):link {}', '_'), 'a:link.⭐️_ {}');
equal(scopeStylesheet(':global(a:link) {}', '_'), 'a:link {}');
equal(scopeStylesheet(':global(p:lang(en)) {}', '_'), 'p:lang(en) {}');
equal(scopeStylesheet(':global(p:nth-child(2)) {}', '_'), 'p:nth-child(2) {}');
equal(scopeStylesheet(':global(:root) {}', '_'), ':root {}');
equal(scopeStylesheet(':global(p:not(.blue)) {}', '_'), 'p:not(.blue) {}');
assert.equal(scopeStylesheet(':global(a):link {}', '_'), 'a:link.⭐️_ {}');
assert.equal(scopeStylesheet(':global(a:link) {}', '_'), 'a:link {}');
assert.equal(scopeStylesheet(':global(p:lang(en)) {}', '_'), 'p:lang(en) {}');
assert.equal(scopeStylesheet(':global(p:nth-child(2)) {}', '_'), 'p:nth-child(2) {}');
assert.equal(scopeStylesheet(':global(:root) {}', '_'), ':root {}');
assert.equal(scopeStylesheet(':global(p:not(.blue)) {}', '_'), 'p:not(.blue) {}');
});
scopedStyles('nested global inside not', () => {
equal(scopeStylesheet('p:not(:global(.red)){}', '_'), 'p:not(.red).⭐️_{}');
test('nested global inside not', () => {
assert.equal(scopeStylesheet('p:not(:global(.red)){}', '_'), 'p:not(.red).⭐️_{}');
equal(scopeStylesheet(':global(p:nth-child(3n+1):hover) {}', '_'), 'p:nth-child(3n+1):hover {}');
equal(scopeStylesheet(':global(p:nth-child(3n+1) div) {}', '_'), 'p:nth-child(3n+1) div {}');
assert.equal(
scopeStylesheet(':global(p:nth-child(3n+1):hover) {}', '_'),
'p:nth-child(3n+1):hover {}'
);
assert.equal(
scopeStylesheet(':global(p:nth-child(3n+1) div) {}', '_'),
'p:nth-child(3n+1) div {}'
);
equal(scopeStylesheet(':global(::selection) {}', '_'), '::selection {}');
assert.equal(scopeStylesheet(':global(::selection) {}', '_'), '::selection {}');
});
scopedStyles('global with pseudo element', () => {
equal(scopeStylesheet(':global(a::after){}', '_'), 'a::after{}');
// equal(scopeStylesheet(':global(a)::before{}', '_'), 'a::before{}');
test('global with pseudo element', () => {
assert.equal(scopeStylesheet(':global(a::after){}', '_'), 'a::after{}');
// assert.equal(scopeStylesheet(':global(a)::before{}', '_'), 'a::before{}');
equal(scopeStylesheet(':global(a).red::before {}', '_'), 'a.red.⭐️_::before {}');
equal(scopeStylesheet(':global(a.red) span::before {}', '_'), 'a.red span.⭐️_::before {}');
assert.equal(scopeStylesheet(':global(a).red::before {}', '_'), 'a.red.⭐️_::before {}');
assert.equal(
scopeStylesheet(':global(a.red) span::before {}', '_'),
'a.red span.⭐️_::before {}'
);
});
scopedStyles('global with pseudo element', () => {
equal(
test('global with pseudo element', () => {
assert.equal(
scopeStylesheet(
'@keyframes :global(slidein) { from { transform: translateX(0%); } to { transform: translateX(100%); } }',
'_'
),
'@keyframes slidein { from { transform: translateX(0%); } to { transform: translateX(100%); } }'
);
equal(
assert.equal(
scopeStylesheet('@media screen and (min-width: 900px) { :global(div) {} }', '_'),
'@media screen and (min-width: 900px) { div {} }'
);
});
scopedStyles.run();

4
packages/qwik/src/core/use/use-task.ts
View File

@@ -1,6 +1,6 @@
import { newInvokeContext, invoke, waitAndRun, untrack } from './use-core';
import { logError, logErrorAndStop } from '../util/log';
import { delay, safeCall, then } from '../util/promises';
import { delay, safeCall, maybeThen } from '../util/promises';
import { isFunction, isObject, type ValueOrPromise } from '../util/types';
import { isServerPlatform } from '../platform/platform';
import { implicit$FirstArg } from '../util/implicit_dollar';
@@ -602,7 +602,7 @@ export const runResource = <T>(
});
const promise = safeCall(
() => then(waitOn, () => taskFn(opts)),
() => maybeThen(waitOn, () => taskFn(opts)),
(value) => {
setState(true, value);
},

14
packages/qwik/src/core/util/case.unit.ts
View File

@@ -1,12 +1,8 @@
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { fromCamelToKebabCase } from './case';
const caseSuite = suite('case');
caseSuite('should convert to kebab', () => {
equal(fromCamelToKebabCase('HelloWorld'), '-hello-world');
equal(fromCamelToKebabCase('on:ClicK'), 'on:-clic-k');
equal(fromCamelToKebabCase('a:b'), 'a:b');
test('should convert to kebab', () => {
assert.equal(fromCamelToKebabCase('HelloWorld'), '-hello-world');
assert.equal(fromCamelToKebabCase('on:ClicK'), 'on:-clic-k');
assert.equal(fromCamelToKebabCase('a:b'), 'a:b');
});
caseSuite.run();

2
packages/qwik/src/core/util/promises.ts
View File

@@ -24,7 +24,7 @@ export const safeCall = <T, B, C>(
}
};
export const then = <T, B>(
export const maybeThen = <T, B>(
promise: ValueOrPromise<T>,
thenFn: (arg: Awaited<T>) => ValueOrPromise<B>
): ValueOrPromise<B> => {

142
packages/qwik/src/optimizer/src/plugins/plugin.unit.ts
View File

@@ -1,89 +1,87 @@
import path, { resolve } from 'node:path';
import { suite } from 'uvu';
import { assert, test } from 'vitest';
import type { QwikManifest } from '../types';
import { createPlugin } from './plugin';
import { equal } from 'uvu/assert';
import { normalizePath } from '../../../testing/util';
const cwd = process.cwd();
const test = suite('normalizeOptions');
test('defaults', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions();
equal(opts.target, 'client');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hook' });
equal(opts.debug, false);
equal(opts.rootDir, normalizePath(cwd));
equal(opts.tsconfigFileNames, ['./tsconfig.json']);
equal(opts.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
equal(opts.outDir, normalizePath(resolve(cwd, 'dist')));
equal(opts.manifestInput, null);
equal(opts.manifestOutput, null);
equal(opts.srcDir, normalizePath(resolve(cwd, 'src')));
equal(opts.srcInputs, null);
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hook' });
assert.deepEqual(opts.debug, false);
assert.deepEqual(opts.rootDir, normalizePath(cwd));
assert.deepEqual(opts.tsconfigFileNames, ['./tsconfig.json']);
assert.deepEqual(opts.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
assert.deepEqual(opts.outDir, normalizePath(resolve(cwd, 'dist')));
assert.deepEqual(opts.manifestInput, null);
assert.deepEqual(opts.manifestOutput, null);
assert.deepEqual(opts.srcDir, normalizePath(resolve(cwd, 'src')));
assert.deepEqual(opts.srcInputs, null);
});
test('defaults (buildMode: production)', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ buildMode: 'production' });
equal(opts.target, 'client');
equal(opts.buildMode, 'production');
equal(opts.entryStrategy, { type: 'smart' });
equal(opts.resolveQwikBuild, true);
equal(opts.debug, false);
equal(opts.rootDir, normalizePath(cwd));
equal(opts.tsconfigFileNames, ['./tsconfig.json']);
equal(opts.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
equal(opts.outDir, normalizePath(resolve(cwd, 'dist')));
equal(opts.manifestInput, null);
equal(opts.manifestOutput, null);
equal(opts.srcDir, normalizePath(resolve(cwd, 'src')));
equal(opts.srcInputs, null);
equal(opts.entryStrategy, { type: 'smart' });
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'production');
assert.deepEqual(opts.entryStrategy, { type: 'smart' });
assert.deepEqual(opts.resolveQwikBuild, true);
assert.deepEqual(opts.debug, false);
assert.deepEqual(opts.rootDir, normalizePath(cwd));
assert.deepEqual(opts.tsconfigFileNames, ['./tsconfig.json']);
assert.deepEqual(opts.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
assert.deepEqual(opts.outDir, normalizePath(resolve(cwd, 'dist')));
assert.deepEqual(opts.manifestInput, null);
assert.deepEqual(opts.manifestOutput, null);
assert.deepEqual(opts.srcDir, normalizePath(resolve(cwd, 'src')));
assert.deepEqual(opts.srcInputs, null);
assert.deepEqual(opts.entryStrategy, { type: 'smart' });
});
test('defaults (target: ssr)', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ target: 'ssr' });
equal(opts.target, 'ssr');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hoist' });
equal(opts.resolveQwikBuild, true);
equal(opts.debug, false);
equal(opts.rootDir, normalizePath(cwd));
equal(opts.tsconfigFileNames, ['./tsconfig.json']);
equal(opts.input, [normalizePath(resolve(cwd, 'src', 'entry.ssr.tsx'))]);
equal(opts.outDir, normalizePath(resolve(cwd, 'server')));
equal(opts.manifestInput, null);
equal(opts.manifestOutput, null);
equal(opts.srcDir, normalizePath(resolve(cwd, 'src')));
equal(opts.srcInputs, null);
assert.deepEqual(opts.target, 'ssr');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hoist' });
assert.deepEqual(opts.resolveQwikBuild, true);
assert.deepEqual(opts.debug, false);
assert.deepEqual(opts.rootDir, normalizePath(cwd));
assert.deepEqual(opts.tsconfigFileNames, ['./tsconfig.json']);
assert.deepEqual(opts.input, [normalizePath(resolve(cwd, 'src', 'entry.ssr.tsx'))]);
assert.deepEqual(opts.outDir, normalizePath(resolve(cwd, 'server')));
assert.deepEqual(opts.manifestInput, null);
assert.deepEqual(opts.manifestOutput, null);
assert.deepEqual(opts.srcDir, normalizePath(resolve(cwd, 'src')));
assert.deepEqual(opts.srcInputs, null);
});
test('defaults (buildMode: production, target: ssr)', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ buildMode: 'production', target: 'ssr' });
equal(opts.target, 'ssr');
equal(opts.buildMode, 'production');
equal(opts.entryStrategy, { type: 'hoist' });
equal(opts.resolveQwikBuild, true);
equal(opts.debug, false);
equal(opts.rootDir, normalizePath(cwd));
equal(opts.tsconfigFileNames, ['./tsconfig.json']);
equal(opts.input, [normalizePath(resolve(cwd, 'src', 'entry.ssr.tsx'))]);
equal(opts.outDir, normalizePath(resolve(cwd, 'server')));
equal(opts.manifestInput, null);
equal(opts.manifestOutput, null);
equal(opts.srcDir, normalizePath(resolve(cwd, 'src')));
equal(opts.srcInputs, null);
assert.deepEqual(opts.target, 'ssr');
assert.deepEqual(opts.buildMode, 'production');
assert.deepEqual(opts.entryStrategy, { type: 'hoist' });
assert.deepEqual(opts.resolveQwikBuild, true);
assert.deepEqual(opts.debug, false);
assert.deepEqual(opts.rootDir, normalizePath(cwd));
assert.deepEqual(opts.tsconfigFileNames, ['./tsconfig.json']);
assert.deepEqual(opts.input, [normalizePath(resolve(cwd, 'src', 'entry.ssr.tsx'))]);
assert.deepEqual(opts.outDir, normalizePath(resolve(cwd, 'server')));
assert.deepEqual(opts.manifestInput, null);
assert.deepEqual(opts.manifestOutput, null);
assert.deepEqual(opts.srcDir, normalizePath(resolve(cwd, 'src')));
assert.deepEqual(opts.srcInputs, null);
});
test('debug true', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ debug: true });
equal(opts.debug, true);
assert.deepEqual(opts.debug, true);
});
test('override entryStrategy', async () => {
@@ -92,7 +90,7 @@ test('override entryStrategy', async () => {
entryStrategy: { type: 'component' },
buildMode: 'production',
});
equal(opts.entryStrategy.type, 'component');
assert.deepEqual(opts.entryStrategy.type, 'component');
});
test('entryStrategy, smart', async () => {
@@ -100,13 +98,13 @@ test('entryStrategy, smart', async () => {
const opts = plugin.normalizeOptions({
entryStrategy: { type: 'smart' },
});
equal(opts.entryStrategy.type, 'smart');
assert.deepEqual(opts.entryStrategy.type, 'smart');
});
test('entryStrategy, hook no forceFullBuild', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ entryStrategy: { type: 'hook' } });
equal(opts.entryStrategy.type, 'hook');
assert.deepEqual(opts.entryStrategy.type, 'hook');
});
test('entryStrategy, hook and srcInputs', async () => {
@@ -115,21 +113,21 @@ test('entryStrategy, hook and srcInputs', async () => {
entryStrategy: { type: 'hook' },
srcInputs: [],
});
equal(opts.entryStrategy.type, 'hook');
assert.deepEqual(opts.entryStrategy.type, 'hook');
});
test('rootDir, abs path', async () => {
const plugin = await mockPlugin();
const customRoot = normalizePath(resolve(cwd, 'abs-path'));
const opts = plugin.normalizeOptions({ rootDir: customRoot });
equal(opts.rootDir, customRoot);
assert.deepEqual(opts.rootDir, customRoot);
});
test('rootDir, rel path', async () => {
const plugin = await mockPlugin();
const customRoot = 'rel-path';
const opts = plugin.normalizeOptions({ rootDir: customRoot });
equal(opts.rootDir, normalizePath(resolve(cwd, customRoot)));
assert.deepEqual(opts.rootDir, normalizePath(resolve(cwd, customRoot)));
});
test('tsconfigFileNames', async () => {
@@ -137,7 +135,7 @@ test('tsconfigFileNames', async () => {
const opts = plugin.normalizeOptions({
tsconfigFileNames: ['./tsconfig.json', './tsconfig.app.json'],
});
equal(opts.tsconfigFileNames, ['./tsconfig.json', './tsconfig.app.json']);
assert.deepEqual(opts.tsconfigFileNames, ['./tsconfig.json', './tsconfig.app.json']);
});
test('tsconfigFileNames, empty array fallback to default', async () => {
@@ -145,13 +143,13 @@ test('tsconfigFileNames, empty array fallback to default', async () => {
const opts = plugin.normalizeOptions({
tsconfigFileNames: [],
});
equal(opts.tsconfigFileNames, ['./tsconfig.json']);
assert.deepEqual(opts.tsconfigFileNames, ['./tsconfig.json']);
});
test('input string', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ input: 'src/cmps/main.tsx' });
equal(opts.input, [normalizePath(resolve(cwd, 'src', 'cmps', 'main.tsx'))]);
assert.deepEqual(opts.input, [normalizePath(resolve(cwd, 'src', 'cmps', 'main.tsx'))]);
});
test('input array', async () => {
@@ -159,7 +157,7 @@ test('input array', async () => {
const opts = plugin.normalizeOptions({
input: ['src/cmps/a.tsx', 'src/cmps/b.tsx'],
});
equal(opts.input, [
assert.deepEqual(opts.input, [
normalizePath(resolve(cwd, 'src', 'cmps', 'a.tsx')),
normalizePath(resolve(cwd, 'src', 'cmps', 'b.tsx')),
]);
@@ -168,14 +166,14 @@ test('input array', async () => {
test('outDir', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ outDir: 'out' });
equal(opts.outDir, normalizePath(resolve(cwd, 'out')));
assert.deepEqual(opts.outDir, normalizePath(resolve(cwd, 'out')));
});
test('manifestOutput', async () => {
const plugin = await mockPlugin();
const manifestOutput = () => {};
const opts = plugin.normalizeOptions({ manifestOutput });
equal(opts.manifestOutput, manifestOutput);
assert.deepEqual(opts.manifestOutput, manifestOutput);
});
test('manifestInput', async () => {
@@ -188,19 +186,19 @@ test('manifestInput', async () => {
version: '1',
};
const opts = plugin.normalizeOptions({ manifestInput });
equal(opts.manifestInput, manifestInput);
assert.deepEqual(opts.manifestInput, manifestInput);
});
test('resolveQwikBuild true', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ resolveQwikBuild: true });
equal(opts.resolveQwikBuild, true);
assert.deepEqual(opts.resolveQwikBuild, true);
});
test('resolveQwikBuild false', async () => {
const plugin = await mockPlugin();
const opts = plugin.normalizeOptions({ resolveQwikBuild: false });
equal(opts.resolveQwikBuild, false);
assert.deepEqual(opts.resolveQwikBuild, false);
});
async function mockPlugin() {
@@ -218,5 +216,3 @@ async function mockPlugin() {
await plugin.init();
return plugin;
}
test.run();

104
packages/qwik/src/optimizer/src/plugins/rollup.unit.ts
View File

@@ -3,11 +3,9 @@ import { qwikRollup } from './rollup';
import type { Rollup } from 'vite';
import type { OptimizerOptions } from '../types';
import type { NormalizedQwikPluginOptions } from './plugin';
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { normalizePath } from '../../../testing/util';
const rollup = suite('rollup');
const cwd = process.cwd();
function mockOptimizerOptions(): OptimizerOptions {
@@ -24,18 +22,18 @@ function mockOptimizerOptions(): OptimizerOptions {
};
}
rollup('rollup default input options, client', async () => {
test('rollup default input options, client', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
};
const plugin = qwikRollup(initOpts);
const rollupInputOpts: Rollup.InputOptions = await plugin.options!({});
equal(typeof rollupInputOpts.onwarn, 'function');
equal(rollupInputOpts.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
assert.deepEqual(typeof rollupInputOpts.onwarn, 'function');
assert.deepEqual(rollupInputOpts.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
});
rollup('rollup default input options, ssr', async () => {
test('rollup default input options, ssr', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'ssr',
@@ -44,13 +42,13 @@ rollup('rollup default input options, ssr', async () => {
const rollupInputOpts: Rollup.InputOptions = await plugin.options!({});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(typeof rollupInputOpts.onwarn, 'function');
equal(rollupInputOpts.treeshake, undefined);
equal(rollupInputOpts.input, [normalizePath(resolve(cwd, 'src', 'entry.ssr.tsx'))]);
equal(opts.input, [normalizePath(resolve(cwd, 'src', 'entry.ssr.tsx'))]);
assert.deepEqual(typeof rollupInputOpts.onwarn, 'function');
assert.deepEqual(rollupInputOpts.treeshake, undefined);
assert.deepEqual(rollupInputOpts.input, [normalizePath(resolve(cwd, 'src', 'entry.ssr.tsx'))]);
assert.deepEqual(opts.input, [normalizePath(resolve(cwd, 'src', 'entry.ssr.tsx'))]);
});
rollup('rollup default set input options, ssr', async () => {
test('rollup default set input options, ssr', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'ssr',
@@ -61,13 +59,13 @@ rollup('rollup default set input options, ssr', async () => {
});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(typeof rollupInputOpts.onwarn, 'function');
equal(rollupInputOpts.treeshake, undefined);
equal(rollupInputOpts.input, normalizePath(resolve(cwd, 'src', 'my.ssr.tsx')));
equal(opts.input, [normalizePath(resolve(cwd, 'src', 'my.ssr.tsx'))]);
assert.deepEqual(typeof rollupInputOpts.onwarn, 'function');
assert.deepEqual(rollupInputOpts.treeshake, undefined);
assert.deepEqual(rollupInputOpts.input, normalizePath(resolve(cwd, 'src', 'my.ssr.tsx')));
assert.deepEqual(opts.input, [normalizePath(resolve(cwd, 'src', 'my.ssr.tsx'))]);
});
rollup('rollup default output options, client', async () => {
test('rollup default output options, client', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
} as any;
@@ -75,11 +73,11 @@ rollup('rollup default output options, client', async () => {
await plugin.options!({});
const rollupOutputOpts: Rollup.OutputOptions = await plugin.outputOptions!({});
equal(rollupOutputOpts.dir, normalizePath(resolve(cwd, 'dist')));
equal(rollupOutputOpts.format, 'es');
assert.deepEqual(rollupOutputOpts.dir, normalizePath(resolve(cwd, 'dist')));
assert.deepEqual(rollupOutputOpts.format, 'es');
});
rollup('rollup default output options, ssr', async () => {
test('rollup default output options, ssr', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'ssr',
@@ -90,11 +88,11 @@ rollup('rollup default output options, ssr', async () => {
format: 'cjs',
});
equal(rollupOutputOpts.dir, normalizePath(resolve(cwd, 'server')));
equal(rollupOutputOpts.exports, 'auto');
assert.deepEqual(rollupOutputOpts.dir, normalizePath(resolve(cwd, 'server')));
assert.deepEqual(rollupOutputOpts.exports, 'auto');
});
rollup('rollup input, default', async () => {
test('rollup input, default', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
} as any;
@@ -102,14 +100,14 @@ rollup('rollup input, default', async () => {
await plugin.options!({});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(opts.target, 'client');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hook' });
equal(opts.rootDir, normalizePath(cwd));
equal(opts.srcDir, normalizePath(resolve(cwd, 'src')));
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hook' });
assert.deepEqual(opts.rootDir, normalizePath(cwd));
assert.deepEqual(opts.srcDir, normalizePath(resolve(cwd, 'src')));
});
rollup('rollup input, client default', async () => {
test('rollup input, client default', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'client',
@@ -118,12 +116,12 @@ rollup('rollup input, client default', async () => {
await plugin.options!({});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(opts.target, 'client');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hook' });
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hook' });
});
rollup('rollup input, client/production default', async () => {
test('rollup input, client/production default', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'client',
@@ -133,12 +131,12 @@ rollup('rollup input, client/production default', async () => {
await plugin.options!({});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(opts.target, 'client');
equal(opts.buildMode, 'production');
equal(opts.entryStrategy, { type: 'smart' });
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'production');
assert.deepEqual(opts.entryStrategy, { type: 'smart' });
});
rollup('rollup input, ssr/development default', async () => {
test('rollup input, ssr/development default', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'ssr',
@@ -148,12 +146,12 @@ rollup('rollup input, ssr/development default', async () => {
await plugin.options!({});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(opts.target, 'ssr');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hoist' });
assert.deepEqual(opts.target, 'ssr');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hoist' });
});
rollup('rollup input, ssr/production default', async () => {
test('rollup input, ssr/production default', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'ssr',
@@ -163,12 +161,12 @@ rollup('rollup input, ssr/production default', async () => {
await plugin.options!({});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(opts.target, 'ssr');
equal(opts.buildMode, 'production');
equal(opts.entryStrategy, { type: 'hoist' });
assert.deepEqual(opts.target, 'ssr');
assert.deepEqual(opts.buildMode, 'production');
assert.deepEqual(opts.entryStrategy, { type: 'hoist' });
});
rollup('rollup input, lib/production default', async () => {
test('rollup input, lib/production default', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'lib',
@@ -178,12 +176,12 @@ rollup('rollup input, lib/production default', async () => {
await plugin.options!({});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(opts.target, 'lib');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'inline' });
assert.deepEqual(opts.target, 'lib');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'inline' });
});
rollup('rollup input, forceFullBuild true', async () => {
test('rollup input, forceFullBuild true', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
target: 'ssr',
@@ -193,9 +191,7 @@ rollup('rollup input, forceFullBuild true', async () => {
await plugin.options!({});
const opts: NormalizedQwikPluginOptions = plugin.api.getOptions();
equal(opts.target, 'ssr');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hoist' });
assert.deepEqual(opts.target, 'ssr');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hoist' });
});
rollup.run();

249
packages/qwik/src/optimizer/src/plugins/vite.unit.ts
View File

@@ -2,9 +2,8 @@ import path, { resolve } from 'node:path';
import { qwikVite } from './vite';
import type { OptimizerOptions } from '../types';
import type { Rollup } from 'vite';
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { normalizePath } from '../../../testing/util';
import { assert, test } from 'vitest';
const cwd = process.cwd();
@@ -22,8 +21,6 @@ function mockOptimizerOptions(): OptimizerOptions {
};
}
const vite = suite('vite plugin');
const includeDeps = undefined;
const noExternal = ['@builder.io/qwik', '@builder.io/qwik/server', '@builder.io/qwik/build'];
@@ -40,7 +37,7 @@ const excludeDeps = [
'@qwik-client-manifest',
];
vite('command: serve, mode: development', async () => {
test('command: serve, mode: development', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
};
@@ -51,29 +48,29 @@ vite('command: serve, mode: development', async () => {
const rollupOptions = build!.rollupOptions!;
const outputOptions = rollupOptions.output as Rollup.OutputOptions;
equal(opts.target, 'client');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hook' });
equal(opts.debug, false);
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hook' });
assert.deepEqual(opts.debug, false);
equal(build.outDir, normalizePath(resolve(cwd, 'dist')));
equal(rollupOptions.input, normalizePath(resolve(cwd, 'src', 'entry.dev.tsx')));
equal(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
equal(outputOptions.chunkFileNames, 'build/[name].js');
equal(outputOptions.entryFileNames, 'build/[name].js');
equal(outputOptions.format, 'es');
equal(build.dynamicImportVarsOptions?.exclude, [/./]);
equal(build.ssr, undefined);
equal(c.optimizeDeps?.include, includeDeps);
equal(c.optimizeDeps?.exclude, excludeDeps);
assert.deepEqual(build.outDir, normalizePath(resolve(cwd, 'dist')));
assert.deepEqual(rollupOptions.input, normalizePath(resolve(cwd, 'src', 'entry.dev.tsx')));
assert.deepEqual(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
assert.deepEqual(outputOptions.chunkFileNames, 'build/[name].js');
assert.deepEqual(outputOptions.entryFileNames, 'build/[name].js');
assert.deepEqual(outputOptions.format, 'es');
assert.deepEqual(build.dynamicImportVarsOptions?.exclude, [/./]);
assert.deepEqual(build.ssr, undefined);
assert.deepEqual(c.optimizeDeps?.include, includeDeps);
assert.deepEqual(c.optimizeDeps?.exclude, excludeDeps);
equal(c.esbuild, false);
equal(c.ssr, {
assert.deepEqual(c.esbuild, false);
assert.deepEqual(c.ssr, {
noExternal,
});
});
vite('command: serve, mode: production', async () => {
test('command: serve, mode: production', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
};
@@ -84,30 +81,30 @@ vite('command: serve, mode: production', async () => {
const rollupOptions = build!.rollupOptions!;
const outputOptions = rollupOptions.output as Rollup.OutputOptions;
equal(opts.target, 'client');
equal(opts.buildMode, 'production');
equal(opts.entryStrategy, { type: 'hook' });
equal(opts.debug, false);
equal(opts.resolveQwikBuild, true);
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'production');
assert.deepEqual(opts.entryStrategy, { type: 'hook' });
assert.deepEqual(opts.debug, false);
assert.deepEqual(opts.resolveQwikBuild, true);
equal(build.outDir, normalizePath(resolve(cwd, 'dist')));
equal(build.emptyOutDir, undefined);
equal(rollupOptions.input, normalizePath(resolve(cwd, 'src', 'entry.dev.tsx')));
equal(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
equal(outputOptions.chunkFileNames, 'build/q-[hash].js');
equal(outputOptions.entryFileNames, 'build/q-[hash].js');
equal(outputOptions.format, 'es');
equal(build.dynamicImportVarsOptions?.exclude, [/./]);
equal(build.ssr, undefined);
equal(c.optimizeDeps?.include, includeDeps);
equal(c.optimizeDeps?.exclude, excludeDeps);
equal(c.esbuild, false);
equal(c.ssr, {
assert.deepEqual(build.outDir, normalizePath(resolve(cwd, 'dist')));
assert.deepEqual(build.emptyOutDir, undefined);
assert.deepEqual(rollupOptions.input, normalizePath(resolve(cwd, 'src', 'entry.dev.tsx')));
assert.deepEqual(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
assert.deepEqual(outputOptions.chunkFileNames, 'build/q-[hash].js');
assert.deepEqual(outputOptions.entryFileNames, 'build/q-[hash].js');
assert.deepEqual(outputOptions.format, 'es');
assert.deepEqual(build.dynamicImportVarsOptions?.exclude, [/./]);
assert.deepEqual(build.ssr, undefined);
assert.deepEqual(c.optimizeDeps?.include, includeDeps);
assert.deepEqual(c.optimizeDeps?.exclude, excludeDeps);
assert.deepEqual(c.esbuild, false);
assert.deepEqual(c.ssr, {
noExternal,
});
});
vite('command: build, mode: development', async () => {
test('command: build, mode: development', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
};
@@ -118,33 +115,33 @@ vite('command: build, mode: development', async () => {
const rollupOptions = build!.rollupOptions!;
const outputOptions = rollupOptions.output as Rollup.OutputOptions;
equal(opts.target, 'client');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hook' });
equal(opts.debug, false);
equal(opts.resolveQwikBuild, true);
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hook' });
assert.deepEqual(opts.debug, false);
assert.deepEqual(opts.resolveQwikBuild, true);
equal(plugin.enforce, 'pre');
equal(build.outDir, normalizePath(resolve(cwd, 'dist')));
equal(build.emptyOutDir, undefined);
equal(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
equal(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
equal(outputOptions.chunkFileNames, 'build/[name].js');
equal(outputOptions.entryFileNames, 'build/[name].js');
equal(build.dynamicImportVarsOptions?.exclude, [/./]);
equal(build.ssr, undefined);
equal(c.optimizeDeps?.include, includeDeps);
equal(c.optimizeDeps?.exclude, excludeDeps);
equal(c.esbuild, {
assert.deepEqual(plugin.enforce, 'pre');
assert.deepEqual(build.outDir, normalizePath(resolve(cwd, 'dist')));
assert.deepEqual(build.emptyOutDir, undefined);
assert.deepEqual(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
assert.deepEqual(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
assert.deepEqual(outputOptions.chunkFileNames, 'build/[name].js');
assert.deepEqual(outputOptions.entryFileNames, 'build/[name].js');
assert.deepEqual(build.dynamicImportVarsOptions?.exclude, [/./]);
assert.deepEqual(build.ssr, undefined);
assert.deepEqual(c.optimizeDeps?.include, includeDeps);
assert.deepEqual(c.optimizeDeps?.exclude, excludeDeps);
assert.deepEqual(c.esbuild, {
logLevel: 'error',
jsx: 'automatic',
});
equal(c.ssr, {
assert.deepEqual(c.ssr, {
noExternal,
});
});
vite('command: build, mode: production', async () => {
test('command: build, mode: production', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
};
@@ -155,34 +152,34 @@ vite('command: build, mode: production', async () => {
const rollupOptions = build!.rollupOptions!;
const outputOptions = rollupOptions.output as Rollup.OutputOptions;
equal(opts.target, 'client');
equal(opts.buildMode, 'production');
equal(opts.entryStrategy, { type: 'smart' });
equal(opts.debug, false);
equal(opts.resolveQwikBuild, true);
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'production');
assert.deepEqual(opts.entryStrategy, { type: 'smart' });
assert.deepEqual(opts.debug, false);
assert.deepEqual(opts.resolveQwikBuild, true);
equal(plugin.enforce, 'pre');
equal(build.outDir, normalizePath(resolve(cwd, 'dist')));
equal(build.emptyOutDir, undefined);
equal(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
equal(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
equal(outputOptions.chunkFileNames, 'build/q-[hash].js');
equal(outputOptions.entryFileNames, 'build/q-[hash].js');
equal(build.outDir, normalizePath(resolve(cwd, 'dist')));
equal(build.dynamicImportVarsOptions?.exclude, [/./]);
equal(build.ssr, undefined);
equal(c.optimizeDeps?.include, includeDeps);
equal(c.optimizeDeps?.exclude, excludeDeps);
equal(c.esbuild, {
assert.deepEqual(plugin.enforce, 'pre');
assert.deepEqual(build.outDir, normalizePath(resolve(cwd, 'dist')));
assert.deepEqual(build.emptyOutDir, undefined);
assert.deepEqual(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
assert.deepEqual(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
assert.deepEqual(outputOptions.chunkFileNames, 'build/q-[hash].js');
assert.deepEqual(outputOptions.entryFileNames, 'build/q-[hash].js');
assert.deepEqual(build.outDir, normalizePath(resolve(cwd, 'dist')));
assert.deepEqual(build.dynamicImportVarsOptions?.exclude, [/./]);
assert.deepEqual(build.ssr, undefined);
assert.deepEqual(c.optimizeDeps?.include, includeDeps);
assert.deepEqual(c.optimizeDeps?.exclude, excludeDeps);
assert.deepEqual(c.esbuild, {
logLevel: 'error',
jsx: 'automatic',
});
equal(c.ssr, {
assert.deepEqual(c.ssr, {
noExternal,
});
});
vite('command: build, --mode production (client)', async () => {
test('command: build, --mode production (client)', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
client: {
@@ -196,16 +193,16 @@ vite('command: build, --mode production (client)', async () => {
const opts = await plugin.api?.getOptions();
const build = c.build!;
const rollupOptions = build!.rollupOptions!;
equal(opts.resolveQwikBuild, true);
assert.deepEqual(opts.resolveQwikBuild, true);
equal(opts.target, 'client');
equal(opts.buildMode, 'production');
equal(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
equal(build.outDir, normalizePath(resolve(cwd, 'client-dist')));
equal(build.emptyOutDir, undefined);
assert.deepEqual(opts.target, 'client');
assert.deepEqual(opts.buildMode, 'production');
assert.deepEqual(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'root.tsx'))]);
assert.deepEqual(build.outDir, normalizePath(resolve(cwd, 'client-dist')));
assert.deepEqual(build.emptyOutDir, undefined);
});
vite('command: build, --ssr entry.server.tsx', async () => {
test('command: build, --ssr entry.server.tsx', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
};
@@ -219,32 +216,32 @@ vite('command: build, --ssr entry.server.tsx', async () => {
const rollupOptions = build!.rollupOptions!;
const outputOptions = rollupOptions.output as Rollup.OutputOptions;
equal(opts.target, 'ssr');
equal(opts.buildMode, 'development');
equal(opts.entryStrategy, { type: 'hoist' });
equal(opts.debug, false);
equal(opts.resolveQwikBuild, true);
assert.deepEqual(opts.target, 'ssr');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(opts.entryStrategy, { type: 'hoist' });
assert.deepEqual(opts.debug, false);
assert.deepEqual(opts.resolveQwikBuild, true);
equal(plugin.enforce, 'pre');
equal(build.outDir, normalizePath(resolve(cwd, 'server')));
equal(build.emptyOutDir, undefined);
equal(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'entry.server.tsx'))]);
equal(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
equal(outputOptions.chunkFileNames, undefined);
equal(outputOptions.entryFileNames, undefined);
equal(build.outDir, normalizePath(resolve(cwd, 'server')));
equal(build.dynamicImportVarsOptions?.exclude, [/./]);
equal(build.ssr, true);
equal(c.optimizeDeps?.include, includeDeps);
equal(c.optimizeDeps?.exclude, excludeDeps);
equal(c.esbuild, {
assert.deepEqual(plugin.enforce, 'pre');
assert.deepEqual(build.outDir, normalizePath(resolve(cwd, 'server')));
assert.deepEqual(build.emptyOutDir, undefined);
assert.deepEqual(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'entry.server.tsx'))]);
assert.deepEqual(outputOptions.assetFileNames, 'build/q-[hash].[ext]');
assert.deepEqual(outputOptions.chunkFileNames, undefined);
assert.deepEqual(outputOptions.entryFileNames, undefined);
assert.deepEqual(build.outDir, normalizePath(resolve(cwd, 'server')));
assert.deepEqual(build.dynamicImportVarsOptions?.exclude, [/./]);
assert.deepEqual(build.ssr, true);
assert.deepEqual(c.optimizeDeps?.include, includeDeps);
assert.deepEqual(c.optimizeDeps?.exclude, excludeDeps);
assert.deepEqual(c.esbuild, {
logLevel: 'error',
jsx: 'automatic',
});
equal(c.publicDir, false);
assert.deepEqual(c.publicDir, false);
});
vite('command: serve, --mode ssr', async () => {
test('command: serve, --mode ssr', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
ssr: {
@@ -261,18 +258,18 @@ vite('command: serve, --mode ssr', async () => {
const build = c.build!;
const rollupOptions = build!.rollupOptions!;
equal(opts.target, 'ssr');
equal(opts.buildMode, 'development');
equal(build.minify, undefined);
equal(build.ssr, undefined);
equal(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'renderz.tsx'))]);
equal(c.build.outDir, normalizePath(resolve(cwd, 'ssr-dist')));
equal(build.emptyOutDir, undefined);
equal(c.publicDir, undefined);
equal(opts.resolveQwikBuild, true);
assert.deepEqual(opts.target, 'ssr');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(build.minify, undefined);
assert.deepEqual(build.ssr, undefined);
assert.deepEqual(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'renderz.tsx'))]);
assert.deepEqual(c.build.outDir, normalizePath(resolve(cwd, 'ssr-dist')));
assert.deepEqual(build.emptyOutDir, undefined);
assert.deepEqual(c.publicDir, undefined);
assert.deepEqual(opts.resolveQwikBuild, true);
});
vite('command: build, --mode lib', async () => {
test('command: build, --mode lib', async () => {
const initOpts = {
optimizerOptions: mockOptimizerOptions(),
};
@@ -292,14 +289,12 @@ vite('command: build, --mode lib', async () => {
const build = c.build!;
const rollupOptions = build!.rollupOptions!;
equal(opts.target, 'lib');
equal(opts.buildMode, 'development');
equal(build.minify, false);
equal(build.ssr, undefined);
equal(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'index.ts'))]);
equal(c.build.outDir, normalizePath(resolve(cwd, 'lib')));
equal(build.emptyOutDir, undefined);
equal(opts.resolveQwikBuild, true);
assert.deepEqual(opts.target, 'lib');
assert.deepEqual(opts.buildMode, 'development');
assert.deepEqual(build.minify, false);
assert.deepEqual(build.ssr, undefined);
assert.deepEqual(rollupOptions.input, [normalizePath(resolve(cwd, 'src', 'index.ts'))]);
assert.deepEqual(c.build.outDir, normalizePath(resolve(cwd, 'lib')));
assert.deepEqual(build.emptyOutDir, undefined);
assert.deepEqual(opts.resolveQwikBuild, true);
});
vite.run();

15
packages/qwik/src/server/prefetch-utils.unit.ts
View File

@@ -1,19 +1,16 @@
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
import { flattenPrefetchResources } from './prefetch-utils';
const prefetch = suite('prefetch implementation');
prefetch('flattenPrefetchResources, no imports', () => {
test('flattenPrefetchResources, no imports', () => {
const p = [
{ url: 'a.js', imports: [] },
{ url: 'b.js', imports: [] },
{ url: 'c.js', imports: [] },
];
equal(flattenPrefetchResources(p), ['a.js', 'b.js', 'c.js']);
assert.deepEqual(flattenPrefetchResources(p), ['a.js', 'b.js', 'c.js']);
});
prefetch('flattenPrefetchResources, w/ imports', () => {
test('flattenPrefetchResources, w/ imports', () => {
const p = [
{
url: 'a.js',
@@ -36,7 +33,5 @@ prefetch('flattenPrefetchResources, w/ imports', () => {
],
},
];
equal(flattenPrefetchResources(p), ['a.js', 'x.js', 'y.js', 'b.js', 'c.js', 'z.js']);
assert.deepEqual(flattenPrefetchResources(p), ['a.js', 'x.js', 'y.js', 'b.js', 'c.js', 'z.js']);
});
prefetch.run();

85
packages/qwik/src/testing/document.unit.ts
View File

@@ -1,124 +1,119 @@
import { createDocument, createWindow, ensureGlobals } from './document';
import { pathToFileURL } from 'node:url';
import { suite, test } from 'uvu';
import { equal, match, not, throws } from 'uvu/assert';
import { assert, test } from 'vitest';
test('should create document', () => {
const win = createWindow({
url: pathToFileURL(__filename),
});
match(win.document.baseURI, 'file://');
match(win.document.baseURI, 'document.unit.ts');
assert.include(win.document.baseURI, 'file://');
assert.include(win.document.baseURI, 'document.unit.ts');
});
const ensureGlobalsSuite = suite('ensureGlobals');
ensureGlobalsSuite('noop history.go()', () => {
test('noop history.go()', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
not.throws(() => {
assert.doesNotThrow(() => {
glb.history.go(1);
});
});
ensureGlobalsSuite('noop history.back()', () => {
test('noop history.back()', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
not.throws(() => {
assert.doesNotThrow(() => {
glb.history.back();
});
});
ensureGlobalsSuite('noop history.forward()', () => {
test('noop history.forward()', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
not.throws(() => {
assert.doesNotThrow(() => {
glb.history.forward();
});
});
ensureGlobalsSuite('noop history.replaceState()', () => {
test('noop history.replaceState()', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
not.throws(() => {
assert.doesNotThrow(() => {
glb.history.replaceState(null, '', '/url');
});
});
ensureGlobalsSuite('noop history.pushState()', () => {
test('noop history.pushState()', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
not.throws(() => {
assert.doesNotThrow(() => {
glb.history.pushState(null, '', '/url');
});
});
ensureGlobalsSuite('noop addEventListener', () => {
test('noop addEventListener', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
not.throws(() => {
assert.doesNotThrow(() => {
glb.addEventListener('load', () => {});
});
});
ensureGlobalsSuite('noop removeEventListener', () => {
test('noop removeEventListener', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
not.throws(() => {
assert.doesNotThrow(() => {
glb.removeEventListener('load', () => {});
});
});
ensureGlobalsSuite('baseURI', () => {
test('baseURI', () => {
const glb = ensureGlobals({ nodeType: 9 }, { url: 'http://my.qwik.dev/my-path' });
equal(glb.document.baseURI, 'http://my.qwik.dev/my-path');
assert.equal(glb.document.baseURI, 'http://my.qwik.dev/my-path');
glb.document.baseURI = 'http://my.qwik.dev/new-path';
equal(glb.document.baseURI, 'http://my.qwik.dev/new-path');
assert.equal(glb.document.baseURI, 'http://my.qwik.dev/new-path');
});
ensureGlobalsSuite('location, no options', () => {
test('location, no options', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
equal(glb.location.pathname, '/');
assert.equal(glb.location.pathname, '/');
glb.location.pathname = '/new-path';
equal(glb.location.pathname, '/new-path');
assert.equal(glb.location.pathname, '/new-path');
});
ensureGlobalsSuite('location', () => {
test('location', () => {
const glb = ensureGlobals({ nodeType: 9 }, { url: '/my-path' });
equal(glb.location.pathname, '/my-path');
assert.equal(glb.location.pathname, '/my-path');
});
ensureGlobalsSuite('origin, no options', () => {
test('origin, no options', () => {
const glb = ensureGlobals({ nodeType: 9 }, {});
equal(glb.origin, 'http://document.qwik.dev');
assert.equal(glb.origin, 'http://document.qwik.dev');
});
ensureGlobalsSuite('origin', () => {
test('origin', () => {
const glb = ensureGlobals({ nodeType: 9 }, { url: '/my-path' });
equal(glb.origin, 'http://document.qwik.dev');
assert.equal(glb.origin, 'http://document.qwik.dev');
});
ensureGlobalsSuite('invalid document', () => {
throws(() => {
test('invalid document', () => {
assert.throws(() => {
ensureGlobals({}, {});
});
});
ensureGlobalsSuite('qwik server createDocument()', () => {
test('qwik server createDocument()', () => {
const doc = createDocument();
not.equal(doc.defaultView, undefined);
equal(doc.defaultView!.document, doc);
assert.notEqual(doc.defaultView, undefined);
assert.equal(doc.defaultView!.document, doc);
});
ensureGlobalsSuite('qwik server createWindow()', () => {
test('qwik server createWindow()', () => {
const win = createWindow();
not.equal(win.document.defaultView, undefined);
equal(win.document.defaultView, win);
assert.notEqual(win.document.defaultView, undefined);
assert.equal(win.document.defaultView, win);
});
ensureGlobalsSuite('some other document', () => {
test('some other document', () => {
const doc: any = {
nodeType: 9,
};
ensureGlobals(doc, {});
ensureGlobals(doc, {}); // shouldn't reset
not.equal(doc.defaultView, undefined);
equal(doc.defaultView.document, doc);
assert.notEqual(doc.defaultView, undefined);
assert.equal(doc.defaultView.document, doc);
});
ensureGlobalsSuite.run();

4
packages/qwik/src/testing/expect-dom.unit.tsx → packages/qwik/src/testing/expect-dom.tsx
View File

@@ -1,6 +1,6 @@
import { assert } from 'vitest';
import { QSlot } from '../core/util/markers';
import { isHtmlElement } from '../core/util/types';
import { snapshot } from 'uvu/assert';
import { format } from 'prettier';
/**
@@ -28,5 +28,5 @@ export function isQSLotTemplateElement(node: Node | null | undefined): node is H
export async function expectDOM(actual: Element, expected: string) {
const options = { parser: 'html', htmlWhitespaceSensitivity: 'ignore' as const };
snapshot(await format(actual.outerHTML, options), await format(expected, options));
assert.equal(await format(actual.outerHTML, options), await format(expected, options));
}

40
packages/qwik/src/testing/util.unit.ts
View File

@@ -1,31 +1,27 @@
import { normalizeUrl } from './util';
import { suite } from 'uvu';
import { equal } from 'uvu/assert';
import { assert, test } from 'vitest';
const normalizeUrlSuite = suite('normalizeUrl');
normalizeUrlSuite('no url', () => {
equal(normalizeUrl(null).href, 'http://document.qwik.dev/');
equal(normalizeUrl(undefined).href, 'http://document.qwik.dev/');
equal(normalizeUrl('').href, 'http://document.qwik.dev/');
equal(normalizeUrl({} as any).href, 'http://document.qwik.dev/');
test('no url', () => {
assert.equal(normalizeUrl(null).href, 'http://document.qwik.dev/');
assert.equal(normalizeUrl(undefined).href, 'http://document.qwik.dev/');
assert.equal(normalizeUrl('').href, 'http://document.qwik.dev/');
assert.equal(normalizeUrl({} as any).href, 'http://document.qwik.dev/');
});
normalizeUrlSuite('string, full url', () => {
test('string, full url', () => {
const url = normalizeUrl('https://my.qwik.dev/some-path?query=string#hash');
equal(url.pathname, '/some-path');
equal(url.hash, '#hash');
equal(url.searchParams.get('query'), 'string');
equal(url.origin, 'https://my.qwik.dev');
equal(url.href, 'https://my.qwik.dev/some-path?query=string#hash');
assert.equal(url.pathname, '/some-path');
assert.equal(url.hash, '#hash');
assert.equal(url.searchParams.get('query'), 'string');
assert.equal(url.origin, 'https://my.qwik.dev');
assert.equal(url.href, 'https://my.qwik.dev/some-path?query=string#hash');
});
normalizeUrlSuite('string, pathname', () => {
test('string, pathname', () => {
const url = normalizeUrl('/some-path?query=string#hash');
equal(url.pathname, '/some-path');
equal(url.hash, '#hash');
equal(url.searchParams.get('query'), 'string');
equal(url.origin, 'http://document.qwik.dev');
equal(url.href, 'http://document.qwik.dev/some-path?query=string#hash');
assert.equal(url.pathname, '/some-path');
assert.equal(url.hash, '#hash');
assert.equal(url.searchParams.get('query'), 'string');
assert.equal(url.origin, 'http://document.qwik.dev');
assert.equal(url.href, 'http://document.qwik.dev/some-path?query=string#hash');
});
normalizeUrlSuite.run();

8
packages/supabase-auth-helpers-qwik/package.json
View File

@@ -5,12 +5,12 @@
"author": "Qwik Team",
"bugs": "https://github.com/BuilderIO/qwik/issues",
"dependencies": {
"@supabase/auth-helpers-shared": "0.4.1"
"@supabase/auth-helpers-shared": "^0.5.0"
},
"devDependencies": {
"@builder.io/qwik": "1.2.10",
"@builder.io/qwik-city": "1.2.10",
"@supabase/supabase-js": "^2.33.1"
"@builder.io/qwik": "^1.2.13",
"@builder.io/qwik-city": "^1.2.13",
"@supabase/supabase-js": "^2.38.0"
},
"exports": {
".": {

3628
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

5
scripts/api.ts
View File

@@ -203,7 +203,10 @@ function createTypesApi(
if (msg.text.includes('Analysis will use')) {
return;
}
if (msg.messageId === 'console-compiler-version-notice') {
if (
msg.messageId === 'console-compiler-version-notice' ||
msg.messageId === 'ae-undocumented'
) {
return;
}
console.error(`❌ API Extractor, submodule: "${inPath}"\n${extractorConfigPath}\n`, msg);

2
starters/adapters/express/package.json
View File

@@ -6,7 +6,7 @@
},
"devDependencies": {
"@types/compression": "^1.7.2",
"@types/express": "4.17.17",
"@types/express": "^4.17.19",
"compression": "^1.7.4",
"express": "4.18.2"
},

4
starters/adapters/firebase/functions/package.json
View File

@@ -14,10 +14,10 @@
"type": "module",
"main": "index.js",
"dependencies": {
"@google-cloud/functions-framework": "^3.3.0",
"firebase-admin": "^11.8.0",
"firebase-functions": "^4.3.1",
"@google-cloud/functions-framework": "^3.3.0",
"undici": "^5.22.1"
"undici": "^5.26.0"
},
"devDependencies": {
"firebase-functions-test": "^3.1.0"

2
starters/adapters/firebase/package.json
View File

@@ -6,7 +6,7 @@
"deploy": "firebase deploy"
},
"devDependencies": {
"firebase-tools": "12.4.3"
"firebase-tools": "^12.6.2"
},
"__qwik__": {
"priority": 30,

6
starters/apps/base/package.json
View File

@@ -22,13 +22,13 @@
"@types/node": "latest",
"@typescript-eslint/eslint-plugin": "latest",
"@typescript-eslint/parser": "latest",
"eslint-plugin-qwik": "latest",
"eslint": "latest",
"undici": "latest",
"eslint-plugin-qwik": "latest",
"prettier": "latest",
"typescript": "latest",
"undici": "latest",
"vite": "latest",
"vite-tsconfig-paths": "4.2.0"
"vite-tsconfig-paths": "^4.2.1"
},
"trustedDependencies": [
"sharp"

8
starters/apps/library/package.json
View File

@@ -38,14 +38,14 @@
"@types/node": "latest",
"@typescript-eslint/eslint-plugin": "latest",
"@typescript-eslint/parser": "latest",
"eslint-plugin-qwik": "latest",
"eslint": "latest",
"undici": "latest",
"np": "7.6.1",
"eslint-plugin-qwik": "latest",
"np": "^8.0.4",
"prettier": "latest",
"typescript": "latest",
"undici": "latest",
"vite": "latest",
"vite-tsconfig-paths": "4.2.0"
"vite-tsconfig-paths": "^4.2.1"
},
"__qwik__": {
"displayName": "Component library",

5
starters/e2e/qwikcity/util.ts
View File

@@ -41,9 +41,8 @@ export async function assertPage(ctx: TestContext, test: AssertPage) {
const noFindChildLayout = parentLocator.locator(`[data-test-layout]`);
if (await noFindChildLayout.isVisible()) {
const layoutName = await noFindChildLayout.getAttribute(
"data-test-layout",
)!;
const layoutName =
await noFindChildLayout.getAttribute("data-test-layout")!;
expect(
layoutName,
`Should not be another nested layout, but found [data-test-layout="${layoutName}"], pathname: ${pageUrl.pathname}`,

2
starters/features/leaflet-map/package.json
View File

@@ -25,6 +25,6 @@
"leaflet": "1.9.4"
},
"devDependencies": {
"@types/leaflet": "1.9.4"
"@types/leaflet": "^1.9.6"
}
}

2
starters/features/orama/package.json
View File

@@ -18,6 +18,6 @@
}
},
"devDependencies": {
"@orama/orama": "1.1.1"
"@orama/orama": "^1.2.11"
}
}

2
starters/features/pandacss/package.json
View File

@@ -23,7 +23,7 @@
},
"devDependencies": {
"@builder.io/vite-plugin-macro": "~0.0.7",
"@pandacss/dev": "^0.14.0"
"@pandacss/dev": "^0.15.5"
},
"scripts": {
"prebuild.pandacss": "panda codegen --silent"

2
starters/features/partytown/package.json
View File

@@ -36,6 +36,6 @@
}
},
"devDependencies": {
"@builder.io/partytown": "^0.8.0"
"@builder.io/partytown": "^0.8.1"
}
}

2
starters/features/playwright/package.json
View File

@@ -10,7 +10,7 @@
]
},
"devDependencies": {
"@playwright/test": "1.36.2"
"@playwright/test": "^1.38.1"
},
"scripts": {
"test.e2e": "playwright test"

2
starters/features/postcss/package.json
View File

@@ -11,7 +11,7 @@
},
"devDependencies": {
"autoprefixer": "^10.4.14",
"postcss": "8.4.27",
"postcss": "^8.4.31",
"postcss-preset-env": "^9.1.0"
}
}

4
starters/features/react/package.json
View File

@@ -33,8 +33,8 @@
"@emotion/styled": "^11.11.0",
"@mui/material": "^5.13.0",
"@mui/x-data-grid": "^6.4.0",
"@types/react": "18.2.17",
"@types/react-dom": "18.2.7",
"@types/react": "^18.2.28",
"@types/react-dom": "^18.2.13",
"react": "18.2.0",
"react-dom": "18.2.0"
}

16
starters/features/storybook/package.json
View File

@@ -9,14 +9,14 @@
]
},
"devDependencies": {
"@storybook/addon-essentials": "7.1.1",
"@storybook/addon-links": "7.1.1",
"@storybook/blocks": "7.1.1",
"@storybook/builder-vite": "7.1.1",
"@storybook/html": "7.1.1",
"@storybook/html-vite": "7.1.1",
"storybook": "7.1.1",
"storybook-framework-qwik": "0.2.3"
"@storybook/addon-essentials": "^7.4.6",
"@storybook/addon-links": "^7.4.6",
"@storybook/blocks": "^7.4.6",
"@storybook/builder-vite": "^7.4.6",
"@storybook/html": "^7.4.6",
"@storybook/html-vite": "^7.4.6",
"storybook": "^7.4.6",
"storybook-framework-qwik": "^0.2.4"
},
"scripts": {
"build-storybook": "storybook build",

6
starters/features/tailwind/package.json
View File

@@ -11,8 +11,8 @@
},
"devDependencies": {
"autoprefixer": "^10.4.14",
"postcss": "8.4.27",
"tailwindcss": "3.3.3",
"prettier-plugin-tailwindcss": "^0.5.4"
"postcss": "^8.4.31",
"prettier-plugin-tailwindcss": "^0.5.4",
"tailwindcss": "3.3.3"
}
}

Some files were not shown because too many files have changed in this diff Show More