clients(psi): include global reports styles in legacy psi rendering (#…

…13151)
GoogleChrome · Sep 30, 2021 · b0fa0f6 · b0fa0f6
1 parent b132cf7
commit b0fa0f6
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/report/clients/psi.js b/report/clients/psi.js
@@ -77,6 +77,7 @@ export function prepareLabData(LHResult, document) {
  reportLHR.categoryGroups,
  {environment: 'PSI', gatherMode: lhResult.gatherMode}
  );
+ perfCategoryEl.append(dom.createComponent('styles'));
 
  const scoreGaugeEl = dom.find('.lh-score__gauge', perfCategoryEl);
  scoreGaugeEl.remove();

diff --git a/report/test/clients/psi-test.js b/report/test/clients/psi-test.js
@@ -67,8 +67,6 @@ describe('PSI', () => {
  // Check that the report exists and has some content.
  assert.ok(result.perfCategoryEl instanceof document.defaultView.Element);
  assert.ok(result.perfCategoryEl.outerHTML.length > 50000, 'perfCategory HTML is populated');
- assert.ok(!result.perfCategoryEl.outerHTML.includes('lh-permalink'),
- 'PSI\'s perfCategory HTML doesn\'t include a lh-permalink element');
  // Assume using default locale.
  const title = result.perfCategoryEl.querySelector('.lh-audit-group--metrics')
  .querySelector('.lh-audit-group__title').textContent;
@@ -83,7 +81,8 @@ describe('PSI', () => {
 
  assert.ok(result.perfCategoryEl instanceof document.defaultView.Element);
  assert.ok(result.perfCategoryEl.outerHTML.length > 50000, 'perfCategory HTML is populated');
- assert.ok(!result.perfCategoryEl.outerHTML.includes('lh-permalink'),
+ // styles for .lh-permalink are ok, but not the HTML
+ assert.ok(!result.perfCategoryEl.outerHTML.includes('class="lh-permalink'),
  'PSI\'s perfCategory HTML doesn\'t include a lh-permalink element');
 
  assert.equal(typeof result.finalScreenshotDataUri, 'string');