test(e2e): standardize file content assertions using helper functions

e2e/cases/css/css-modules-dom/index.test.ts

@@ -1,4 +1,4 @@
-import { expect, test } from '@e2e/helper';
+import { expect, findFile, test } from '@e2e/helper';
 
 test('should inject styles and not emit CSS files when output.injectStyles is true', async ({
   page,
@@ -8,9 +8,7 @@ test('should inject styles and not emit CSS files when output.injectStyles is tr
 
   // injectStyles worked
   const files = rsbuild.getDistFiles();
-  const cssFiles = Object.keys(files).filter((file) => file.endsWith('.css'));
-
-  expect(cssFiles.length).toBe(0);
+  expect(() => findFile(files, '.css')).toThrowError();
 
   // scss worked
   const header = page.locator('#header');

e2e/cases/css/inject-styles-lightningcss/index.test.ts

@@ -1,4 +1,4 @@
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, getFileContent, rspackTest } from '@e2e/helper';
 
 rspackTest(
   'should use lightningcss-loader to transform and minify CSS when injectStyles is true',
@@ -9,12 +9,10 @@ rspackTest(
     const files = rsbuild.getDistFiles();
 
     // should inline minified CSS
-    const indexJsFile = Object.keys(files).find(
-      (file) => file.includes('index.') && file.endsWith('.js'),
-    )!;
+    const indexJs = getFileContent(files, 'index.js');
 
     expect(
-      files[indexJsFile].includes(
+      indexJs.includes(
         '@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){.item{-webkit-user-select:none;user-select:none;background:linear-gradient(#fff,#000);transition:all .5s}}',
       ),
     ).toBeTruthy();

e2e/cases/css/inject-styles/index.test.ts

@@ -1,6 +1,6 @@
 import fs from 'node:fs';
 import { join } from 'node:path';
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, findFile, getFileContent, rspackTest } from '@e2e/helper';
 
 const fixtures = __dirname;
 
@@ -11,19 +11,14 @@ rspackTest(
 
     // injectStyles worked
     const files = rsbuild.getDistFiles();
-    const cssFiles = Object.keys(files).filter((file) => file.endsWith('.css'));
-    expect(cssFiles.length).toBe(0);
+    expect(() => findFile(files, '.css')).toThrowError();
 
     // should inline minified CSS
-    const indexJsFile = Object.keys(files).find(
-      (file) => file.includes('index.') && file.endsWith('.js'),
-    )!;
+    const indexJs = getFileContent(files, 'index.js');
 
+    expect(indexJs.includes('html,body{margin:0;padding:0}')).toBeTruthy();
     expect(
-      files[indexJsFile].includes('html,body{margin:0;padding:0}'),
-    ).toBeTruthy();
-    expect(
-      files[indexJsFile].includes(
+      indexJs.includes(
         '.description{text-align:center;font-size:16px;line-height:1.5}',
       ),
     ).toBeTruthy();
@@ -93,16 +88,13 @@ rspackTest(
 
     // injectStyles worked
     const files = rsbuild.getDistFiles();
-    const cssFiles = Object.keys(files).filter((file) => file.endsWith('.css'));
-    expect(cssFiles.length).toBe(0);
+    expect(() => findFile(files, '.css')).toThrowError();
 
     // should inline CSS
-    const indexJsFile = Object.keys(files).find(
-      (file) => file.includes('index.') && file.endsWith('.js'),
-    )!;
+    const indexJs = getFileContent(files, 'index.js');
 
     expect(
-      files[indexJsFile].includes(`html, body {
+      indexJs.includes(`html, body {
   margin: 0;
   padding: 0;
 }`),

e2e/cases/css/lightningcss-disabled/index.test.ts

@@ -1,13 +1,12 @@
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, getFileContent, rspackTest } from '@e2e/helper';
 
 rspackTest(
   'should allow to disable the built-in lightningcss loader',
   async ({ build }) => {
     const rsbuild = await build();
     const files = rsbuild.getDistFiles();
 
-    const content =
-      files[Object.keys(files).find((file) => file.endsWith('.css'))!];
+    const content = getFileContent(files, '.css');
 
     expect(content).not.toContain('-webkit-');
     expect(content).not.toContain('-ms-');

e2e/cases/css/lightningcss-prefixes/index.test.ts

@@ -1,13 +1,12 @@
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, getFileContent, rspackTest } from '@e2e/helper';
 
 rspackTest(
   'should add vendor prefixes by current browserslist',
   async ({ build }) => {
     const rsbuild = await build();
     const files = rsbuild.getDistFiles();
 
-    const content =
-      files[Object.keys(files).find((file) => file.endsWith('.css'))!];
+    const content = getFileContent(files, '.css');
 
     expect(content).toEqual(
       '@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){.item{-webkit-user-select:none;-ms-user-select:none;user-select:none;background:-webkit-linear-gradient(#000,#fff);background:linear-gradient(#fff,#000);-webkit-transition:all .5s;transition:all .5s}}',
@@ -21,10 +20,7 @@ rspackTest(
     const rsbuild = await dev();
 
     const distFiles = rsbuild.getDistFiles();
-    const content =
-      distFiles[
-        Object.keys(distFiles).find((file) => file.endsWith('css/index.css'))!
-      ];
+    const content = getFileContent(distFiles, 'css/index.css');
     expect(content).toContain(
       `@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
   .item {

e2e/cases/css/nested-npm-import/index.test.ts

@@ -1,6 +1,6 @@
 import fs from 'node:fs';
 import path from 'node:path';
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, getFileContent, rspackTest } from '@e2e/helper';
 
 rspackTest('should compile nested npm import correctly', async ({ build }) => {
   fs.cpSync(
@@ -12,9 +12,9 @@ rspackTest('should compile nested npm import correctly', async ({ build }) => {
   const rsbuild = await build();
 
   const files = rsbuild.getDistFiles();
-  const cssFiles = Object.keys(files).find((file) => file.endsWith('.css'))!;
+  const cssContent = getFileContent(files, '.css');
 
-  expect(files[cssFiles]).toEqual(
+  expect(cssContent).toEqual(
     '#b{color:#ff0}#c{color:green}#a{font-size:10px}html{font-size:18px}',
   );
 });

e2e/cases/css/postcss-config-ts/index.test.ts

@@ -1,14 +1,10 @@
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, getFileContent, rspackTest } from '@e2e/helper';
 
 rspackTest('should load postcss.config.ts correctly', async ({ build }) => {
   const rsbuild = await build();
 
   const files = rsbuild.getDistFiles();
-  const indexCssFile = Object.keys(files).find(
-    (file) => file.includes('index.') && file.endsWith('.css'),
-  )!;
-
-  const indexCssContent = files[indexCssFile];
+  const indexCssContent = getFileContent(files, 'index.css');
   expect(indexCssContent).toContain(
     '.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}',
   );

e2e/cases/css/postcss-function-options-merge/index.test.ts

@@ -1,4 +1,4 @@
-import { expect, test } from '@e2e/helper';
+import { expect, getFileContent, test } from '@e2e/helper';
 
 test('should merge `postcssOptions` function with `postcss.config.ts` as expected', async ({
   build,
@@ -11,15 +11,11 @@ test('should merge `postcssOptions` function with `postcss.config.ts` as expecte
     '.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}}';
 
   const files = rsbuild.getDistFiles();
-  const fooCssFile = Object.keys(files).find(
-    (file) => file.includes('foo.') && file.endsWith('.css'),
-  )!;
-  expect(files[fooCssFile]).toContain(fooCssExpected);
-  expect(files[fooCssFile]).not.toContain(barCssExpected);
+  const fooCss = getFileContent(files, 'foo.css');
+  expect(fooCss).toContain(fooCssExpected);
+  expect(fooCss).not.toContain(barCssExpected);
 
-  const barCssFile = Object.keys(files).find(
-    (file) => file.includes('bar.') && file.endsWith('.css'),
-  )!;
-  expect(files[barCssFile]).toContain(barCssExpected);
-  expect(files[barCssFile]).not.toContain(fooCssExpected);
+  const barCss = getFileContent(files, 'bar.css');
+  expect(barCss).toContain(barCssExpected);
+  expect(barCss).not.toContain(fooCssExpected);
 });

e2e/cases/css/postcss-function-options/index.test.ts

@@ -1,4 +1,4 @@
-import { expect, test } from '@e2e/helper';
+import { expect, getFileContent, test } from '@e2e/helper';
 
 test('should allow to use `postcssOptions` function to apply different postcss config for different files', async ({
   build,
@@ -11,15 +11,11 @@ test('should allow to use `postcssOptions` function to apply different postcss c
     '.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}}';
 
   const files = rsbuild.getDistFiles();
-  const fooCssFile = Object.keys(files).find(
-    (file) => file.includes('foo.') && file.endsWith('.css'),
-  )!;
-  expect(files[fooCssFile]).toContain(fooCssExpected);
-  expect(files[fooCssFile]).not.toContain(barCssExpected);
+  const fooCss = getFileContent(files, 'foo.css');
+  expect(fooCss).toContain(fooCssExpected);
+  expect(fooCss).not.toContain(barCssExpected);
 
-  const barCssFile = Object.keys(files).find(
-    (file) => file.includes('bar.') && file.endsWith('.css'),
-  )!;
-  expect(files[barCssFile]).toContain(barCssExpected);
-  expect(files[barCssFile]).not.toContain(fooCssExpected);
+  const barCss = getFileContent(files, 'bar.css');
+  expect(barCss).toContain(barCssExpected);
+  expect(barCss).not.toContain(fooCssExpected);
 });

e2e/cases/css/relative-import/index.test.ts

@@ -1,13 +1,12 @@
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, getFileContent, rspackTest } from '@e2e/helper';
 
 rspackTest(
   'should compile CSS relative imports correctly',
   async ({ build }) => {
     const rsbuild = await build();
     const files = rsbuild.getDistFiles();
 
-    const content =
-      files[Object.keys(files).find((file) => file.endsWith('.css'))!];
+    const content = getFileContent(files, '.css');
 
     expect(content).toContain(
       '.foo{color:red}.bar{color:#00f}.baz{color:green}',

e2e/cases/css/resolve-alias/index.test.ts

@@ -1,11 +1,10 @@
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, getFileContent, rspackTest } from '@e2e/helper';
 
 rspackTest('should compile CSS with alias correctly', async ({ build }) => {
   const rsbuild = await build();
   const files = rsbuild.getDistFiles();
 
-  const content =
-    files[Object.keys(files).find((file) => file.endsWith('.css'))!];
+  const content = getFileContent(files, '.css');
 
   expect(content).toMatch(
     /\.the-a-class{color:red;background-image:url\(\/static\/image\/icon\.\w{8}\.png\)}\.the-b-class{color:#00f;background-image:url\(\/static\/image\/icon\.\w{8}\.png\)}\.the-c-class{color:#ff0;background-image:url\(\/static\/image\/icon\.\w{8}\.png\)}/,

e2e/cases/css/resolve-ts-paths/index.test.ts

@@ -1,4 +1,4 @@
-import { expect, rspackTest } from '@e2e/helper';
+import { expect, getFileContent, rspackTest } from '@e2e/helper';
 
 rspackTest(
   'should resolve ts paths correctly in SCSS file',
@@ -7,8 +7,7 @@ rspackTest(
 
     const files = rsbuild.getDistFiles();
 
-    const content =
-      files[Object.keys(files).find((file) => file.endsWith('.css'))!];
+    const content = getFileContent(files, '.css');
 
     expect(content).toContain('background-image:url(/static/image/icon');
   },

e2e/cases/css/resolve-url-loader/index.test.ts

@@ -1,13 +1,12 @@
-import { expect, test } from '@e2e/helper';
+import { expect, getFileContent, test } from '@e2e/helper';
 
 test('should resolve relative asset correctly in SCSS file', async ({
   build,
 }) => {
   const rsbuild = await build();
   const files = rsbuild.getDistFiles();
 
-  const content =
-    files[Object.keys(files).find((file) => file.endsWith('.css'))!];
+  const content = getFileContent(files, '.css');
 
   expect(content).toContain('background-image:url(/static/image/icon');
 });