Fix lint issues

Automattic · Jul 24, 2024 · cb12bfb · cb12bfb
1 parent 1bd7edf
commit cb12bfb
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 17 deletions.
diff --git a/projects/js-packages/critical-css-gen/.eslintrc.cjs b/projects/js-packages/critical-css-gen/.eslintrc.cjs
@@ -0,0 +1,5 @@
+module.exports = {
+	settings: {
+		jest: { version: 29 },
+	},
+};
diff --git a/projects/js-packages/critical-css-gen/jest.config.cjs b/projects/js-packages/critical-css-gen/jest.config.cjs
@@ -0,0 +1,5 @@
+const baseConfig = require( 'jetpack-js-tools/jest/config.base.js' );
+
+module.exports = {
+	...baseConfig,
+};
diff --git a/projects/js-packages/critical-css-gen/package.json b/projects/js-packages/critical-css-gen/package.json
@@ -20,6 +20,8 @@
 		"build:node": "tsc --project tsconfig.node.json",
 		"build": "npm run clean && npm run build:browser && npm run build:node",
 		"clean": "rm -rf lib/ && rm -rf dist/",
+		"lint": "prettier --check src/**/* && eslint . && echo '✔ eslint and prettier ran successfully.'",
+		"lint:fix": "prettier --write src/**/*.ts && eslint --fix . && echo '✔ eslint and prettier ran successfully.'",
 		"test": "NODE_ENV=test NODE_PATH=./node_modules jest --forceExit --config=tests/config/jest.config.js"
 	},
 	"main": "./lib/back-end.js",

diff --git a/projects/js-packages/critical-css-gen/tests/unit/browser-interface-iframe.test.js b/projects/js-packages/critical-css-gen/tests/unit/browser-interface-iframe.test.js
@@ -1,9 +1,8 @@
 /* global CriticalCSSGenerator */
-const puppeteer = require( 'puppeteer' );
-
 const path = require( 'path' );
-const TestServer = require( '../lib/test-server' );
+const puppeteer = require( 'puppeteer' );
 const { dataDirectory } = require( '../lib/data-directory' );
+const TestServer = require( '../lib/test-server' );
 
 let testServer = null;
 let browser;
@@ -42,7 +41,7 @@ describe( 'Iframe interface', () => {
 				urls: [ url ],
 				viewports: [ { width: 640, height: 480 } ],
 				browserInterface: new CriticalCSSGenerator.BrowserInterfaceIframe( {
-					verifyPage: ( url, innerWindow, innerDocument ) => {
+					verifyPage: ( _url, innerWindow, innerDocument ) => {
 						return !! innerDocument.querySelector( 'meta[name="testing-page"]' );
 					},
 				} ),
@@ -55,6 +54,7 @@ describe( 'Iframe interface', () => {
 		await page.close();
 	} );
 
+	// eslint-disable-next-line jest/expect-expect
 	it( 'Allows scripts if not explicitly turned off', async () => {
 		const page = await browser.newPage();
 		await page.goto( testServer.getUrl() );
@@ -65,7 +65,7 @@ describe( 'Iframe interface', () => {
 		// 'script-created-content'; a string appended to page-a by a script.
 		await page.evaluate( async url => {
 			const iframeInterface = new CriticalCSSGenerator.BrowserInterfaceIframe( {
-				verifyPage: ( url, innerWindow, innerDocument ) => {
+				verifyPage: ( _url, innerWindow, innerDocument ) => {
 					return innerDocument.documentElement.innerHTML.includes( 'script-created-content' );
 				},
 			} );
@@ -76,6 +76,7 @@ describe( 'Iframe interface', () => {
 		await page.close();
 	} );
 
+	// eslint-disable-next-line jest/expect-expect
 	it( 'Blocks scripts if turned off', async () => {
 		const page = await browser.newPage();
 		await page.goto( testServer.getUrl() );
@@ -86,7 +87,7 @@ describe( 'Iframe interface', () => {
 		// 'script-created-content'; a string appended to page-a by a script.
 		await page.evaluate( async url => {
 			const iframeInterface = new CriticalCSSGenerator.BrowserInterfaceIframe( {
-				verifyPage: ( url, innerWindow, innerDocument ) => {
+				verifyPage: ( _url, innerWindow, innerDocument ) => {
 					return ! innerDocument.documentElement.innerHTML.includes( 'script-created-content' );
 				},
 				allowScripts: false,
@@ -109,7 +110,7 @@ describe( 'Iframe interface', () => {
 				urls: [ url ],
 				viewports: [ { width: 640, height: 480 } ],
 				browserInterface: new CriticalCSSGenerator.BrowserInterfaceIframe( {
-					verifyPage: ( url, innerWindow, innerDocument ) => {
+					verifyPage: ( _url, innerWindow, innerDocument ) => {
 						return !! innerDocument.querySelector( 'meta[name="testing-page"]' );
 					},
 					allowScripts: false,
@@ -127,8 +128,6 @@ describe( 'Iframe interface', () => {
 		const page = await browser.newPage();
 		await page.goto( testServer.getUrl() );
 
-		const innerUrl = path.join( testServer.getUrl(), 'page-a' );
-
 		await expect( async () => {
 			await page.evaluate( () => {
 				return CriticalCSSGenerator.generateCriticalCSS( {
@@ -156,7 +155,7 @@ describe( 'Iframe interface', () => {
 				urls: [ 'about:blank', url ],
 				viewports: [ { width: 640, height: 480 } ],
 				browserInterface: new CriticalCSSGenerator.BrowserInterfaceIframe( {
-					verifyPage: ( url, innerWindow, innerDocument ) => {
+					verifyPage: ( _url, innerWindow, innerDocument ) => {
 						return !! innerDocument.querySelector( 'meta[name="testing-page"]' );
 					},
 				} ),
@@ -178,10 +177,10 @@ describe( 'Iframe interface', () => {
 		const pageB = path.join( testServer.getUrl(), 'page-b' );
 
 		const [ css, warnings, pages ] = await page.evaluate(
-			async ( pageA, pageB ) => {
-				let pagesVerified = [];
+			async ( pA, pB ) => {
+				const pagesVerified = [];
 				const result = await CriticalCSSGenerator.generateCriticalCSS( {
-					urls: [ 'about:blank', pageA, pageB, 'about:blank' ],
+					urls: [ 'about:blank', pA, pB, 'about:blank' ],
 					viewports: [ { width: 640, height: 480 } ],
 					browserInterface: new CriticalCSSGenerator.BrowserInterfaceIframe( {
 						verifyPage: ( url, innerWindow, innerDocument ) => {

diff --git a/projects/js-packages/critical-css-gen/tests/unit/generate-critical-css.test.js b/projects/js-packages/critical-css-gen/tests/unit/generate-critical-css.test.js
@@ -1,9 +1,8 @@
+const path = require( 'path' );
 const puppeteer = require( 'puppeteer' );
-
 const { generateCriticalCSS, BrowserInterfacePuppeteer } = require( '../../lib/back-end.js' );
 const { dataUrl } = require( '../lib/data-directory' );
 const mockFetch = require( '../lib/mock-fetch' );
-const path = require( 'path' );
 
 const testPageUrls = {
 	pageA: path.join( dataUrl, 'page-a/index.html' ),
@@ -16,13 +15,13 @@ class MockedFetchInterface extends BrowserInterfacePuppeteer {
 	}
 }
 
-let testPages = {};
+const testPages = {};
 
 /**
  * Run a batch of CSS generation test runs, verify the results contain (and do not contain) specific substrings.
  * Verifies no warnings get generated.
  *
- * @param {Object[]} testSets Sets of tests to run, and strings the result should / should not contain.
+ * @param {Object[]} testSets - Sets of tests to run, and strings the result should / should not contain.
  */
 async function runTestSet( testSets ) {
 	for ( const { urls, viewports, shouldContain, shouldNotContain, shouldMatch } of testSets ) {
@@ -70,6 +69,7 @@ describe( 'Generate Critical CSS', () => {
 	} );
 
 	describe( 'Inclusions and Exclusions', () => {
+		// eslint-disable-next-line jest/expect-expect
 		it( 'Excludes elements below the fold', async () => {
 			await runTestSet( [
 				{
@@ -86,6 +86,7 @@ describe( 'Generate Critical CSS', () => {
 			] );
 		} );
 
+		// eslint-disable-next-line jest/expect-expect
 		it( 'Excludes irrelevant media queries', async () => {
 			await runTestSet( [
 				{
@@ -95,6 +96,7 @@ describe( 'Generate Critical CSS', () => {
 			] );
 		} );
 
+		// eslint-disable-next-line jest/expect-expect
 		it( 'Excludes Critical CSS from a <link media="print"> tag', async () => {
 			await runTestSet( [
 				{
@@ -103,6 +105,7 @@ describe( 'Generate Critical CSS', () => {
 			] );
 		} );
 
+		// eslint-disable-next-line jest/expect-expect
 		it( 'Includes implicit @media rules inherited from <link> tags', async () => {
 			await runTestSet( [
 				{
@@ -111,6 +114,7 @@ describe( 'Generate Critical CSS', () => {
 			] );
 		} );
 
+		// eslint-disable-next-line jest/expect-expect
 		it( 'Can manage complex implicit @media rules inherited from <link> tags', async () => {
 			await runTestSet( [
 				{