From c911a40974e37fa9addb1082d8044b91488c3a1c Mon Sep 17 00:00:00 2001 From: Connor Clark Date: Wed, 17 Jul 2019 20:06:26 -0700 Subject: [PATCH 1/7] tests(font-size): fix URL artifact --- lighthouse-core/test/audits/seo/font-size-test.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/lighthouse-core/test/audits/seo/font-size-test.js b/lighthouse-core/test/audits/seo/font-size-test.js index 5e86becfcc5f..5a7261fda2dc 100644 --- a/lighthouse-core/test/audits/seo/font-size-test.js +++ b/lighthouse-core/test/audits/seo/font-size-test.js @@ -8,7 +8,10 @@ const FontSizeAudit = require('../../../audits/seo/font-size.js'); const assert = require('assert'); -const URL = 'https://example.com'; +const URL = { + requestedUrl: 'https://example.com', + finalUrl: 'https://example.com', +}; const validViewport = 'width=device-width'; /* eslint-env jest */ From 01c44e34bad5a24ceea1d9d94511a3218cc262b3 Mon Sep 17 00:00:00 2001 From: Connor Clark Date: Wed, 17 Jul 2019 20:25:44 -0700 Subject: [PATCH 2/7] add test --- .../gather/gatherers/seo/font-size.js | 2 +- .../test/audits/seo/font-size-test.js | 25 +++++++++++++++++++ types/artifacts.d.ts | 1 + 3 files changed, 27 insertions(+), 1 deletion(-) diff --git a/lighthouse-core/gather/gatherers/seo/font-size.js b/lighthouse-core/gather/gatherers/seo/font-size.js index c2617230422c..67b88be347e6 100644 --- a/lighthouse-core/gather/gatherers/seo/font-size.js +++ b/lighthouse-core/gather/gatherers/seo/font-size.js @@ -211,7 +211,7 @@ async function fetchSourceRule(driver, node) { /** * @param {Driver} driver - * @param {LH.Artifacts.FontSize.DomNodeWithParent} textNode text node + * @param {LH.Artifacts.FontSize.DomNodeWithParent} textNode * @returns {Promise} */ async function fetchComputedFontSize(driver, textNode) { diff --git a/lighthouse-core/test/audits/seo/font-size-test.js b/lighthouse-core/test/audits/seo/font-size-test.js index 5a7261fda2dc..a6a11b436f77 100644 --- a/lighthouse-core/test/audits/seo/font-size-test.js +++ b/lighthouse-core/test/audits/seo/font-size-test.js @@ -237,4 +237,29 @@ describe('SEO: Font size audit', () => { expect(auditResult.score).toBe(1); expect(auditResult.notApplicable).toBe(true); }); + + it('attributes inline styles to node', async () => { + const parentNode = { + attributes: ['id', 'my-parent'], + }; + const artifacts = { + URL, + MetaElements: makeMetaElements(validViewport), + FontSize: { + analyzedFailingNodesData: [ + {textLength: 10, fontSize: 10, node: {nodeId: 1, parentNode, localName: 'p', attributes: ['class', 'my-p']}}, + ], + }, + TestedAsMobileDevice: true, + }; + + const auditResult = await FontSizeAudit.audit(artifacts, getFakeContext()); + assert.equal(auditResult.details.items.length, 1); + assert.equal(auditResult.details.items[0].source, URL.finalUrl); + assert.deepEqual(auditResult.details.items[0].selector, { + type: 'node', + selector: '#my-parent', + snippet: '

', + }); + }); }); diff --git a/types/artifacts.d.ts b/types/artifacts.d.ts index a3d4cb8c36c9..78f74fbe1ed1 100644 --- a/types/artifacts.d.ts +++ b/types/artifacts.d.ts @@ -241,6 +241,7 @@ declare global { failingTextLength: number; visitedTextLength: number; analyzedFailingTextLength: number; + /** Elements with a text node that failed size criteria. */ analyzedFailingNodesData: Array<{ fontSize: number; textLength: number; From 0b2c27f2188c4efeafcf69d007003896196c2437 Mon Sep 17 00:00:00 2001 From: Connor Clark Date: Wed, 17 Jul 2019 20:33:24 -0700 Subject: [PATCH 3/7] test --- .../test/audits/seo/font-size-test.js | 23 +++++++++++++++---- 1 file changed, 19 insertions(+), 4 deletions(-) diff --git a/lighthouse-core/test/audits/seo/font-size-test.js b/lighthouse-core/test/audits/seo/font-size-test.js index a6a11b436f77..85bdaacfeadb 100644 --- a/lighthouse-core/test/audits/seo/font-size-test.js +++ b/lighthouse-core/test/audits/seo/font-size-test.js @@ -238,7 +238,13 @@ describe('SEO: Font size audit', () => { expect(auditResult.notApplicable).toBe(true); }); - it('attributes inline styles to node', async () => { + it('attributes inline and attributes styles to node', async () => { + const style1 = { + type: 'Inline', + }; + const style2 = { + type: 'Attributes', + }; const parentNode = { attributes: ['id', 'my-parent'], }; @@ -247,19 +253,28 @@ describe('SEO: Font size audit', () => { MetaElements: makeMetaElements(validViewport), FontSize: { analyzedFailingNodesData: [ - {textLength: 10, fontSize: 10, node: {nodeId: 1, parentNode, localName: 'p', attributes: ['class', 'my-p']}}, + {textLength: 12, fontSize: 10, cssRule: style1, + node: {nodeId: 1, parentNode, localName: 'p', attributes: ['class', 'my-p']}}, + {textLength: 11, fontSize: 10, cssRule: style2, + node: {nodeId: 2, parentNode, localName: 'font', attributes: ['size', '10px']}}, ], }, TestedAsMobileDevice: true, }; const auditResult = await FontSizeAudit.audit(artifacts, getFakeContext()); - assert.equal(auditResult.details.items.length, 1); + assert.equal(auditResult.details.items.length, 2); assert.equal(auditResult.details.items[0].source, URL.finalUrl); assert.deepEqual(auditResult.details.items[0].selector, { type: 'node', selector: '#my-parent', - snippet: '

', + snippet: '

', + }); + assert.equal(auditResult.details.items[1].source, URL.finalUrl); + assert.deepEqual(auditResult.details.items[1].selector, { + type: 'node', + selector: '#my-parent', + snippet: '', }); }); }); From 5faf245e66892c99bc9dc4166a70688620f84e3e Mon Sep 17 00:00:00 2001 From: Connor Clark Date: Thu, 18 Jul 2019 11:52:42 -0700 Subject: [PATCH 4/7] toMatchObject --- lighthouse-core/test/audits/seo/font-size-test.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/lighthouse-core/test/audits/seo/font-size-test.js b/lighthouse-core/test/audits/seo/font-size-test.js index 85bdaacfeadb..2481d9973513 100644 --- a/lighthouse-core/test/audits/seo/font-size-test.js +++ b/lighthouse-core/test/audits/seo/font-size-test.js @@ -265,13 +265,13 @@ describe('SEO: Font size audit', () => { const auditResult = await FontSizeAudit.audit(artifacts, getFakeContext()); assert.equal(auditResult.details.items.length, 2); assert.equal(auditResult.details.items[0].source, URL.finalUrl); - assert.deepEqual(auditResult.details.items[0].selector, { + expect(auditResult.details.items[0].selector).toMatchObject({ type: 'node', selector: '#my-parent', snippet: '

', }); assert.equal(auditResult.details.items[1].source, URL.finalUrl); - assert.deepEqual(auditResult.details.items[1].selector, { + expect(auditResult.details.items[1].selector).toMatchObject({ type: 'node', selector: '#my-parent', snippet: '', From faaa9c025832fb8954b988610cc9a4c479c0a127 Mon Sep 17 00:00:00 2001 From: Connor Clark Date: Thu, 18 Jul 2019 12:00:45 -0700 Subject: [PATCH 5/7] use that describe fn i made elsewhere --- .../test/audits/seo/font-size-test.js | 80 +++++++++++-------- 1 file changed, 45 insertions(+), 35 deletions(-) diff --git a/lighthouse-core/test/audits/seo/font-size-test.js b/lighthouse-core/test/audits/seo/font-size-test.js index 2481d9973513..f15cfc01b237 100644 --- a/lighthouse-core/test/audits/seo/font-size-test.js +++ b/lighthouse-core/test/audits/seo/font-size-test.js @@ -238,43 +238,53 @@ describe('SEO: Font size audit', () => { expect(auditResult.notApplicable).toBe(true); }); - it('attributes inline and attributes styles to node', async () => { - const style1 = { - type: 'Inline', - }; - const style2 = { - type: 'Attributes', - }; - const parentNode = { - attributes: ['id', 'my-parent'], - }; - const artifacts = { - URL, - MetaElements: makeMetaElements(validViewport), - FontSize: { - analyzedFailingNodesData: [ - {textLength: 12, fontSize: 10, cssRule: style1, - node: {nodeId: 1, parentNode, localName: 'p', attributes: ['class', 'my-p']}}, - {textLength: 11, fontSize: 10, cssRule: style2, - node: {nodeId: 2, parentNode, localName: 'font', attributes: ['size', '10px']}}, - ], - }, - TestedAsMobileDevice: true, - }; + describe('attributes source location', () => { + function runFontSizeAuditWithSingleFailingStyle(style, nodeProperties) { + const artifacts = { + URL: {finalUrl: 'http://www.example.com'}, + MetaElements: makeMetaElements(validViewport), + FontSize: { + analyzedFailingNodesData: [ + {textLength: 1, fontSize: 1, node: {nodeId: 1, ...nodeProperties}, cssRule: style}, + ], + }, + TestedAsMobileDevice: true, + }; + return FontSizeAudit.audit(artifacts, getFakeContext()); + } - const auditResult = await FontSizeAudit.audit(artifacts, getFakeContext()); - assert.equal(auditResult.details.items.length, 2); - assert.equal(auditResult.details.items[0].source, URL.finalUrl); - expect(auditResult.details.items[0].selector).toMatchObject({ - type: 'node', - selector: '#my-parent', - snippet: '

', + it('to inline node stylesheet', async () => { + const auditResult = await runFontSizeAuditWithSingleFailingStyle({ + type: 'Inline', + }, { + parentNode: {attributes: ['id', 'my-parent']}, + localName: 'p', + attributes: ['class', 'my-p'], + }); + + assert.equal(auditResult.details.items.length, 1); + expect(auditResult.details.items[0].selector).toMatchObject({ + type: 'node', + selector: '#my-parent', + snippet: '

', + }); }); - assert.equal(auditResult.details.items[1].source, URL.finalUrl); - expect(auditResult.details.items[1].selector).toMatchObject({ - type: 'node', - selector: '#my-parent', - snippet: '', + + it('to attributes node stylesheet', async () => { + const auditResult = await runFontSizeAuditWithSingleFailingStyle({ + type: 'Attributes', + }, { + parentNode: {attributes: ['id', 'my-parent']}, + localName: 'font', + attributes: ['size', '10px'], + }); + + assert.equal(auditResult.details.items.length, 1); + expect(auditResult.details.items[0].selector).toMatchObject({ + type: 'node', + selector: '#my-parent', + snippet: '', + }); }); }); }); From c2f840316fb362490eefd7a09e91f48c9e00d94a Mon Sep 17 00:00:00 2001 From: Connor Clark Date: Thu, 18 Jul 2019 12:02:14 -0700 Subject: [PATCH 6/7] words --- types/artifacts.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/types/artifacts.d.ts b/types/artifacts.d.ts index 78f74fbe1ed1..8dda838f1517 100644 --- a/types/artifacts.d.ts +++ b/types/artifacts.d.ts @@ -241,7 +241,7 @@ declare global { failingTextLength: number; visitedTextLength: number; analyzedFailingTextLength: number; - /** Elements with a text node that failed size criteria. */ + /** Elements that contain a text node that failed size criteria. */ analyzedFailingNodesData: Array<{ fontSize: number; textLength: number; From d61a5ff3fd9b50905a4bf89ceac8a04f18eff4ce Mon Sep 17 00:00:00 2001 From: Connor Clark Date: Thu, 18 Jul 2019 15:54:41 -0700 Subject: [PATCH 7/7] toHaveLength --- lighthouse-core/test/audits/seo/font-size-test.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/lighthouse-core/test/audits/seo/font-size-test.js b/lighthouse-core/test/audits/seo/font-size-test.js index f15cfc01b237..83138f0495bb 100644 --- a/lighthouse-core/test/audits/seo/font-size-test.js +++ b/lighthouse-core/test/audits/seo/font-size-test.js @@ -239,7 +239,7 @@ describe('SEO: Font size audit', () => { }); describe('attributes source location', () => { - function runFontSizeAuditWithSingleFailingStyle(style, nodeProperties) { + async function runFontSizeAuditWithSingleFailingStyle(style, nodeProperties) { const artifacts = { URL: {finalUrl: 'http://www.example.com'}, MetaElements: makeMetaElements(validViewport), @@ -250,7 +250,9 @@ describe('SEO: Font size audit', () => { }, TestedAsMobileDevice: true, }; - return FontSizeAudit.audit(artifacts, getFakeContext()); + const auditResult = await FontSizeAudit.audit(artifacts, getFakeContext()); + expect(auditResult.details.items).toHaveLength(1); + return auditResult; } it('to inline node stylesheet', async () => { @@ -262,7 +264,6 @@ describe('SEO: Font size audit', () => { attributes: ['class', 'my-p'], }); - assert.equal(auditResult.details.items.length, 1); expect(auditResult.details.items[0].selector).toMatchObject({ type: 'node', selector: '#my-parent', @@ -279,7 +280,6 @@ describe('SEO: Font size audit', () => { attributes: ['size', '10px'], }); - assert.equal(auditResult.details.items.length, 1); expect(auditResult.details.items[0].selector).toMatchObject({ type: 'node', selector: '#my-parent',