diff --git a/lighthouse-core/test/report/html/renderer/category-renderer-test.js b/lighthouse-core/test/report/html/renderer/category-renderer-test.js index bbb5547544e2..bab66007708f 100644 --- a/lighthouse-core/test/report/html/renderer/category-renderer-test.js +++ b/lighthouse-core/test/report/html/renderer/category-renderer-test.js @@ -215,16 +215,36 @@ describe('CategoryRenderer', () => { assert.ok(description.querySelector('a'), 'description contains converted markdown links'); }); - // TODO waiting for decision regarding this header - it.skip('renders the failed audits grouped by group', () => { - const categoryDOM = renderer.render(category, sampleResults.categoryGroups); - const failedAudits = category.auditRefs.filter(audit => { - return audit.result.score !== 1 && !audit.result.scoreDisplayMode === 'notApplicable'; + it('renders the failed audits grouped by group', () => { + // Fail all the audits. + const categoryClone = JSON.parse(JSON.stringify(category)); + const auditRefs = categoryClone.auditRefs; + auditRefs.forEach(ref => { + ref.result.score = 0; + ref.result.scoreDisplayMode = 'binary'; }); - const failedAuditTags = new Set(failedAudits.map(audit => audit.group)); + const categoryDOM = renderer.render(categoryClone, sampleResults.categoryGroups); + + // All the group names in the config. + const groupNames = Array.from(new Set(auditRefs.map(ref => ref.group))).filter(Boolean); + assert.ok(groupNames.length > 5, `not enough groups found in category for test`); - const failedAuditGroups = categoryDOM.querySelectorAll('.lh-category > div.lh-audit-group'); - assert.equal(failedAuditGroups.length, failedAuditTags.size); + // All the group roots in the DOM. + const failedGroupElems = Array.from( + categoryDOM.querySelectorAll('.lh-clump--failed > .lh-audit-group')); + + assert.strictEqual(failedGroupElems.length, groupNames.length); + + for (const groupName of groupNames) { + const groupAuditRefs = auditRefs.filter(ref => ref.group === groupName); + assert.ok(groupAuditRefs.length > 0, `no auditRefs found with group '${groupName}'`); + + const className = `lh-audit-group--${groupName}`; + const groupElem = failedGroupElems.find(el => el.classList.contains(className)); + const groupAuditElems = groupElem.querySelectorAll('.lh-audit'); + + assert.strictEqual(groupAuditElems.length, groupAuditRefs.length); + } }); it('renders the passed audits ungrouped', () => {