Reland "[Lighthouse] Rename Audits panel to Lighthouse"
This reverts commit 065146856295c7ebf01d538820d3f2e60c383335.
Reason for revert: Cause of failure has been remedied. See: https://chromium-review.googlesource.com/c/chromium/src/+/2055398
Original change's description:
> Revert "[Lighthouse] Rename Audits panel to Lighthouse"
>
> This reverts commit 2ae53ef04d84c4201836eb63238e97bc180ea54d.
>
> Reason for revert: This CL breaks CI: https://ci.chromium.org/p/devtools-frontend/builders/ci/DevTools%20Linux/453. It looks like the layout test expects audits not lighthouse in the name, so it's probably in need of a 3-way merge.
>
> Original change's description:
> > [Lighthouse] Rename Audits panel to Lighthouse
> >
> > Change-Id: Ia2ab175d2a3b6c8ded73aff8ff0f5582f5a8fa0c
> > Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2044605
> > Commit-Queue: Connor Clark <cjamcl@chromium.org>
> > Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
> > Reviewed-by: Paul Irish <paulirish@chromium.org>
>
> TBR=paulirish@chromium.org,aerotwist@chromium.org,tvanderlippe@chromium.org,cjamcl@chromium.org
>
> Change-Id: Ia6d5f42a0e6ece4352696c51bf0de5754774cb0a
> No-Presubmit: true
> No-Tree-Checks: true
> No-Try: true
> Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2051983
> Reviewed-by: Paul Lewis <aerotwist@chromium.org>
> Commit-Queue: Paul Lewis <aerotwist@chromium.org>
TBR=paulirish@chromium.org,aerotwist@chromium.org,tvanderlippe@chromium.org,cjamcl@chromium.org
# Not skipping CQ checks because original CL landed > 1 day ago.
Bug: 1052111
Change-Id: I638ca9bd5cd94e02fb7318f2a7d7c66fca40e6c8
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2056866
Reviewed-by: Connor Clark <cjamcl@chromium.org>
Reviewed-by: Paul Irish <paulirish@chromium.org>
Reviewed-by: Tim van der Lippe <tvanderlippe@chromium.org>
Commit-Queue: Connor Clark <cjamcl@chromium.org>
diff --git a/front_end/lighthouse/LighthouseReportRenderer.js b/front_end/lighthouse/LighthouseReportRenderer.js
new file mode 100644
index 0000000..c31dd2b
--- /dev/null
+++ b/front_end/lighthouse/LighthouseReportRenderer.js
@@ -0,0 +1,187 @@
+// Copyright 2018 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+const MaxLengthForLinks = 40;
+
+/**
+ * @override
+ */
+export class LighthouseReportRenderer extends ReportRenderer {
+ /**
+ * @param {!Element} el Parent element to render the report into.
+ * @param {!ReportRenderer.RunnerResultArtifacts=} artifacts
+ */
+ static addViewTraceButton(el, artifacts) {
+ if (!artifacts || !artifacts.traces || !artifacts.traces.defaultPass) {
+ return;
+ }
+
+ const container = el.querySelector('.lh-audit-group');
+ const columnsEl = container.querySelector('.lh-columns');
+ // There will be no columns if just the PWA category.
+ if (!columnsEl) {
+ return;
+ }
+
+ const defaultPassTrace = artifacts.traces.defaultPass;
+ const timelineButton = UI.createTextButton(Common.UIString('View Trace'), onViewTraceClick, 'view-trace');
+ container.insertBefore(timelineButton, columnsEl.nextSibling);
+
+ async function onViewTraceClick() {
+ Host.userMetrics.actionTaken(Host.UserMetrics.Action.LighthouseViewTrace);
+ await self.UI.inspectorView.showPanel('timeline');
+ Timeline.TimelinePanel.instance().loadFromEvents(defaultPassTrace.traceEvents);
+ }
+ }
+
+ /**
+ * @param {!Element} el
+ */
+ static async linkifyNodeDetails(el) {
+ const mainTarget = self.SDK.targetManager.mainTarget();
+ const domModel = mainTarget.model(SDK.DOMModel);
+
+ for (const origElement of el.getElementsByClassName('lh-node')) {
+ /** @type {!DetailsRenderer.NodeDetailsJSON} */
+ const detailsItem = origElement.dataset;
+ if (!detailsItem.path) {
+ continue;
+ }
+
+ const nodeId = await domModel.pushNodeByPathToFrontend(detailsItem.path);
+
+ if (!nodeId) {
+ continue;
+ }
+ const node = domModel.nodeForId(nodeId);
+ if (!node) {
+ continue;
+ }
+
+ const element = await Common.Linkifier.linkify(node, {tooltip: detailsItem.snippet});
+ origElement.title = '';
+ origElement.textContent = '';
+ origElement.appendChild(element);
+ }
+ }
+
+ /**
+ * @param {!Element} el
+ */
+ static async linkifySourceLocationDetails(el) {
+ for (const origElement of el.getElementsByClassName('lh-source-location')) {
+ /** @type {!DetailsRenderer.SourceLocationDetailsJSON} */
+ const detailsItem = origElement.dataset;
+ if (!detailsItem.sourceUrl || !detailsItem.sourceLine || !detailsItem.sourceColumn) {
+ continue;
+ }
+ const url = detailsItem.sourceUrl;
+ const line = Number(detailsItem.sourceLine);
+ const column = Number(detailsItem.sourceColumn);
+ const element =
+ await Components.Linkifier.linkifyURL(url, {lineNumber: line, column, maxLength: MaxLengthForLinks});
+ origElement.title = '';
+ origElement.textContent = '';
+ origElement.appendChild(element);
+ }
+ }
+
+ /**
+ * @param {!Element} el
+ */
+ static handleDarkMode(el) {
+ if (self.UI.themeSupport.themeName() === 'dark') {
+ el.classList.add('dark');
+ }
+ }
+}
+
+/**
+ * @override
+ */
+export class LighthouseReportUIFeatures extends ReportUIFeatures {
+ /**
+ * @param {!DOM} dom
+ */
+ constructor(dom) {
+ super(dom);
+ this._beforePrint = null;
+ this._afterPrint = null;
+ }
+
+ /**
+ * @param {?function()} beforePrint
+ */
+ setBeforePrint(beforePrint) {
+ this._beforePrint = beforePrint;
+ }
+
+ /**
+ * @param {?function()} afterPrint
+ */
+ setAfterPrint(afterPrint) {
+ this._afterPrint = afterPrint;
+ }
+
+ /**
+ * Returns the html that recreates this report.
+ * @return {string}
+ * @protected
+ */
+ getReportHtml() {
+ this.resetUIState();
+ return Lighthouse.ReportGenerator.generateReportHtml(this.json);
+ }
+
+ /**
+ * Downloads a file (blob) using the system dialog prompt.
+ * @param {!Blob|!File} blob The file to save.
+ */
+ async _saveFile(blob) {
+ const domain = new Common.ParsedURL(this.json.finalUrl).domain();
+ const sanitizedDomain = domain.replace(/[^a-z0-9.-]+/gi, '_');
+ const timestamp = new Date(this.json.fetchTime).toISO8601Compact();
+ const ext = blob.type.match('json') ? '.json' : '.html';
+ const basename = `${sanitizedDomain}-${timestamp}${ext}`;
+ const text = await blob.text();
+ self.Workspace.fileManager.save(basename, text, true /* forceSaveAs */);
+ }
+
+ async _print() {
+ const document = this.getDocument();
+ const clonedReport = document.querySelector('.lh-root').cloneNode(true /* deep */);
+ const printWindow = window.open('', '_blank', 'channelmode=1,status=1,resizable=1');
+ const style = printWindow.document.createElement('style');
+ style.textContent = Root.Runtime.cachedResources['lighthouse/lighthouse/report.css'];
+ printWindow.document.head.appendChild(style);
+ printWindow.document.body.replaceWith(clonedReport);
+ // Linkified nodes are shadow elements, which aren't exposed via `cloneNode`.
+ await LighthouseReportRenderer.linkifyNodeDetails(clonedReport);
+
+ if (this._beforePrint) {
+ this._beforePrint();
+ }
+ printWindow.focus();
+ printWindow.print();
+ printWindow.close();
+ if (this._afterPrint) {
+ this._afterPrint();
+ }
+ }
+
+ /**
+ * @suppress {visibility}
+ * @return {!Document}
+ */
+ getDocument() {
+ return this._document;
+ }
+
+ /**
+ * @suppress {visibility}
+ */
+ resetUIState() {
+ this._resetUIState();
+ }
+}