Skip to content

Commit 174e1df

Browse files
committed
test: add tests for prebundleSvelteLibraries
1 parent 5e28bad commit 174e1df

File tree

11 files changed

+266
-24
lines changed

11 files changed

+266
-24
lines changed
Lines changed: 1 addition & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
1-
import fs from 'fs';
2-
import path from 'path';
3-
import { getText, isBuild } from '~utils';
1+
import { getText, isBuild, readVitePrebundleMetadata } from '~utils';
42

53
test('should render component imported via svelte field in package.json', async () => {
64
expect(await getText('#test-id')).toBe('svelte field works');
@@ -18,20 +16,3 @@ if (!isBuild) {
1816
);
1917
});
2018
}
21-
22-
function readVitePrebundleMetadata() {
23-
const metadataPaths = [
24-
'../node_modules/.vite/_metadata.json',
25-
'../node_modules/.vite/deps/_metadata.json' // vite 2.9
26-
];
27-
for (const metadataPath of metadataPaths) {
28-
try {
29-
const vitePrebundleMetadata = path.resolve(__dirname, metadataPath);
30-
const metadataFile = fs.readFileSync(vitePrebundleMetadata, 'utf8');
31-
return metadataFile;
32-
} catch {
33-
// ignore
34-
}
35-
}
36-
throw new Error('Unable to find vite prebundle metadata');
37-
}
Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import { browserLogs, getText, isBuild, readVitePrebundleMetadata } from '~utils';
2+
3+
test('should not have failed requests', async () => {
4+
browserLogs.forEach((msg) => {
5+
expect(msg).not.toMatch('404');
6+
});
7+
});
8+
9+
test('should render Hybrid import', async () => {
10+
expect(await getText('#hybrid .label')).toBe('dependency-import');
11+
});
12+
13+
test('should render Simple import', async () => {
14+
expect(await getText('#hybrid .label')).toBe('dependency-import');
15+
});
16+
17+
test('should render Nested import', async () => {
18+
expect(await getText('#nested #message')).toBe('nested');
19+
expect(await getText('#nested #cjs-and-esm')).toBe('esm');
20+
});
21+
22+
test('should render api-only import', async () => {
23+
expect(await getText('#api-only')).toBe('api loaded: true');
24+
});
25+
26+
if (!isBuild) {
27+
test('should optimize svelte dependencies and their cjs subdependencies', () => {
28+
const metadataFile = readVitePrebundleMetadata();
29+
const metadata = JSON.parse(metadataFile);
30+
const optimizedPaths = Object.keys(metadata.optimized);
31+
expect(optimizedPaths).toContain('e2e-test-dep-svelte-simple');
32+
expect(optimizedPaths).toContain('e2e-test-dep-svelte-hybrid');
33+
expect(optimizedPaths).toContain('e2e-test-dep-svelte-api-only');
34+
expect(optimizedPaths).toContain('e2e-test-dep-svelte-hybrid > e2e-test-dep-cjs-only');
35+
expect(optimizedPaths).toContain(
36+
'e2e-test-dep-svelte-nested > e2e-test-dep-svelte-simple > e2e-test-dep-cjs-only'
37+
);
38+
});
39+
40+
test('should not optimize excluded svelte dependencies', () => {
41+
const metadataFile = readVitePrebundleMetadata();
42+
const metadata = JSON.parse(metadataFile);
43+
const optimizedPaths = Object.keys(metadata.optimized);
44+
expect(optimizedPaths).not.toContain('e2e-test-dep-svelte-nested');
45+
});
46+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Vite + Svelte</title>
8+
</head>
9+
<body>
10+
<div id="app"></div>
11+
<script type="module" src="/src/main.js"></script>
12+
</body>
13+
</html>
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"name": "e2e-tests-prebundle-svelte-deps",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "vite build",
9+
"preview": "vite preview"
10+
},
11+
"dependencies": {
12+
"e2e-test-dep-svelte-api-only": "file:../_test_dependencies/svelte-api-only",
13+
"e2e-test-dep-svelte-hybrid": "file:../_test_dependencies/svelte-hybrid",
14+
"e2e-test-dep-svelte-nested": "file:../_test_dependencies/svelte-nested",
15+
"e2e-test-dep-svelte-simple": "file:../_test_dependencies/svelte-simple"
16+
},
17+
"devDependencies": {
18+
"@sveltejs/vite-plugin-svelte": "workspace:*",
19+
"sass": "^1.56.0",
20+
"svelte": "^3.52.0",
21+
"svelte-preprocess": "^4.10.7",
22+
"vite": "^3.2.3"
23+
}
24+
}
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<script>
2+
import Hybrid from 'e2e-test-dep-svelte-hybrid';
3+
import Simple from 'e2e-test-dep-svelte-simple';
4+
import { Message as Nested } from 'e2e-test-dep-svelte-nested';
5+
import { setSomeContext } from 'e2e-test-dep-svelte-api-only';
6+
import { getContext } from 'svelte';
7+
setSomeContext();
8+
let apiOnlyLoaded = !!getContext('svelte-api-only');
9+
</script>
10+
11+
<main>
12+
<div id="hybrid">
13+
<Hybrid />
14+
</div>
15+
<div id="simple">
16+
<Simple />
17+
</div>
18+
<div id="nested">
19+
<Nested id="message" message="nested" />
20+
</div>
21+
<div id="api-only">api loaded: {apiOnlyLoaded}</div>
22+
</main>
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import App from './App.svelte';
2+
3+
const app = new App({
4+
target: document.body
5+
});
6+
7+
export default app;
Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
/// <reference types="svelte" />
2+
/// <reference types="vite/client" />
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import preprocess from 'svelte-preprocess';
2+
export default {
3+
preprocess: [preprocess()],
4+
vitePlugin: {
5+
prebundleSvelteLibraries: true
6+
}
7+
};
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import { defineConfig } from 'vite';
2+
import { svelte } from '@sveltejs/vite-plugin-svelte';
3+
4+
// https://vitejs.dev/config/
5+
export default defineConfig({
6+
plugins: [svelte()],
7+
optimizeDeps: {
8+
// TODO this must be excluded because nested has an scss dep that prebundle can't handle!
9+
// figure out how to exclude it automatically or at least tell the user about it in a more friendly way
10+
exclude: ['e2e-test-dep-svelte-nested'],
11+
include: [
12+
// TODO without this, it fails for module.exports in the browser.
13+
// shouldn't prebundling take care of it?
14+
'e2e-test-dep-svelte-hybrid > e2e-test-dep-cjs-only'
15+
]
16+
},
17+
build: {
18+
// make build faster by skipping transforms and minification
19+
target: 'esnext',
20+
minify: false
21+
}
22+
});

packages/e2e-tests/testUtils.ts

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -268,3 +268,20 @@ export async function fetchPageText() {
268268
throw new Error(`request to ${url} failed with ${res.status} - ${res.statusText}.`);
269269
}
270270
}
271+
272+
export function readVitePrebundleMetadata() {
273+
const metadataPaths = [
274+
'node_modules/.vite/_metadata.json',
275+
'node_modules/.vite/deps/_metadata.json' // vite 2.9
276+
];
277+
for (const metadataPath of metadataPaths) {
278+
try {
279+
const vitePrebundleMetadata = path.resolve(testDir, metadataPath);
280+
const metadataFile = fs.readFileSync(vitePrebundleMetadata, 'utf8');
281+
return metadataFile;
282+
} catch {
283+
// ignore
284+
}
285+
}
286+
throw new Error('Unable to find vite prebundle metadata');
287+
}

pnpm-lock.yaml

Lines changed: 105 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)