[READ-ONLY] Mirror of https://github.com/vitest-dev/vitest. Next generation testing framework powered by Vite.
vitest.dev
test
testing-tools
vite
fix(browser): don't process the default css styles (#6861)
+28
-18
+25
-6
packages/browser/src/node/plugin.ts
+25
-6
packages/browser/src/node/plugin.ts
···
425
425
name: 'vitest:browser:transform-tester-html',
426
426
enforce: 'pre',
427
427
async transformIndexHtml(html, ctx) {
428
-
if (!ctx.path.startsWith(browserServer.prefixTesterUrl)) {
428
+
if (ctx.filename !== browserServer.testerFilepath) {
429
429
return
430
430
}
431
431
···
439
439
? browserServer.stateJs
440
440
: await browserServer.stateJs
441
441
442
-
const testerScripts: HtmlTagDescriptor[] = []
443
-
if (resolve(distRoot, 'client/tester/tester.html') !== browserServer.testerFilepath) {
442
+
const testerTags: HtmlTagDescriptor[] = []
443
+
const isDefaultTemplate = resolve(distRoot, 'client/tester/tester.html') === browserServer.testerFilepath
444
+
if (!isDefaultTemplate) {
444
445
const manifestContent = browserServer.manifest instanceof Promise
445
446
? await browserServer.manifest
446
447
: browserServer.manifest
447
448
const testerEntry = manifestContent['tester/tester.html']
448
449
449
-
testerScripts.push({
450
+
testerTags.push({
450
451
tag: 'script',
451
452
attrs: {
452
453
type: 'module',
···
459
460
for (const importName of testerEntry.imports || []) {
460
461
const entryManifest = manifestContent[importName]
461
462
if (entryManifest) {
462
-
testerScripts.push(
463
+
testerTags.push(
463
464
{
464
465
tag: 'link',
465
466
attrs: {
···
472
473
)
473
474
}
474
475
}
476
+
}
477
+
else {
478
+
// inject the reset style only in the default template,
479
+
// allowing users to customize the style in their own template
480
+
testerTags.push({
481
+
tag: 'style',
482
+
children: `
483
+
html {
484
+
padding: 0;
485
+
margin: 0;
486
+
}
487
+
body {
488
+
padding: 0;
489
+
margin: 0;
490
+
min-height: 100vh;
491
+
}`,
492
+
injectTo: 'head',
493
+
})
475
494
}
476
495
477
496
return [
···
504
523
} as const
505
524
: null,
506
525
...browserServer.testerScripts,
507
-
...testerScripts,
526
+
...testerTags,
508
527
{
509
528
tag: 'script',
510
529
attrs: {
+3
-1
packages/browser/src/node/serverTester.ts
+3
-1
packages/browser/src/node/serverTester.ts
···
3
3
import type { BrowserServer } from './server'
4
4
import crypto from 'node:crypto'
5
5
import { stringify } from 'flatted'
6
+
import { join } from 'pathe'
6
7
import { replacer } from './utils'
7
8
8
9
export async function resolveTester(
···
58
59
: await server.testerHtml
59
60
60
61
try {
61
-
const indexhtml = await server.vite.transformIndexHtml(url.pathname, testerHtml)
62
+
const url = join('/@fs/', server.testerFilepath)
63
+
const indexhtml = await server.vite.transformIndexHtml(url, testerHtml)
62
64
return replacer(indexhtml, {
63
65
__VITEST_FAVICON__: server.faviconUrl,
64
66
__VITEST_INJECTOR__: injector,
-11
packages/browser/src/client/tester/tester.html
-11
packages/browser/src/client/tester/tester.html
···
5
5
<link rel="icon" href="{__VITEST_FAVICON__}" type="image/svg+xml">
6
6
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
7
<title>Vitest Browser Tester</title>
8
-
<style>
9
-
html {
10
-
padding: 0;
11
-
margin: 0;
12
-
}
13
-
body {
14
-
padding: 0;
15
-
margin: 0;
16
-
min-height: 100vh;
17
-
}
18
-
</style>
19
8
</head>
20
9
<body>
21
10
<script type="module" src="./tester.ts"></script>