Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(350)

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/audits2/lighthouse/renderer/details-renderer.js

Issue 2856653002: Roll Lighthouse & add error reporting (Closed)
Patch Set: Created 3 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /** 1 /**
2 * Copyright 2017 Google Inc. All rights reserved. 2 * Copyright 2017 Google Inc. All rights reserved.
3 * 3 *
4 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License. 5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at 6 * You may obtain a copy of the License at
7 * 7 *
8 * http://www.apache.org/licenses/LICENSE-2.0 8 * http://www.apache.org/licenses/LICENSE-2.0
9 * 9 *
10 * Unless required by applicable law or agreed to in writing, software 10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS, 11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 * See the License for the specific language governing permissions and 13 * See the License for the specific language governing permissions and
14 * limitations under the License. 14 * limitations under the License.
15 */ 15 */
16 'use strict'; 16 'use strict';
17 17
18 /* globals self */
19
18 class DetailsRenderer { 20 class DetailsRenderer {
19 /** 21 /**
20 * @param {!DOM} dom 22 * @param {!DOM} dom
21 */ 23 */
22 constructor(dom) { 24 constructor(dom) {
25 /** @private {!DOM} */
23 this._dom = dom; 26 this._dom = dom;
24 } 27 }
25 28
26 /** 29 /**
27 * @param {(!DetailsRenderer.DetailsJSON|!DetailsRenderer.CardsDetailsJSON)} d etails 30 * @param {!DetailsRenderer.DetailsJSON} details
28 * @return {!Element} 31 * @return {!Element}
29 */ 32 */
30 render(details) { 33 render(details) {
31 switch (details.type) { 34 switch (details.type) {
32 case 'text': 35 case 'text':
33 return this._renderText(details); 36 return this._renderText(details);
34 case 'block':
35 return this._renderBlock(details);
36 case 'cards': 37 case 'cards':
37 return this._renderCards(/** @type {!DetailsRenderer.CardsDetailsJSON} * / (details)); 38 return this._renderCards(/** @type {!DetailsRenderer.CardsDetailsJSON} * / (details));
38 case 'list': 39 case 'list':
39 return this._renderList(details); 40 return this._renderList(/** @type {!DetailsRenderer.ListDetailsJSON} */ (details));
40 default: 41 default:
41 throw new Error(`Unknown type: ${details.type}`); 42 throw new Error(`Unknown type: ${details.type}`);
42 } 43 }
43 } 44 }
44 45
45 /** 46 /**
46 * @param {!DetailsRenderer.DetailsJSON} text 47 * @param {!DetailsRenderer.DetailsJSON} text
47 * @return {!Element} 48 * @return {!Element}
48 */ 49 */
49 _renderText(text) { 50 _renderText(text) {
50 const element = this._dom.createElement('div', 'lh-text'); 51 const element = this._dom.createElement('div', 'lh-text');
51 element.textContent = text.text; 52 element.textContent = text.text;
52 return element; 53 return element;
53 } 54 }
54 55
55 /** 56 /**
56 * @param {!DetailsRenderer.DetailsJSON} block 57 * @param {!DetailsRenderer.ListDetailsJSON} list
57 * @return {!Element}
58 */
59 _renderBlock(block) {
60 const element = this._dom.createElement('div', 'lh-block');
61 const items = block.items || [];
62 for (const item of items) {
63 element.appendChild(this.render(item));
64 }
65 return element;
66 }
67
68 /**
69 * @param {!DetailsRenderer.DetailsJSON} list
70 * @return {!Element} 58 * @return {!Element}
71 */ 59 */
72 _renderList(list) { 60 _renderList(list) {
73 const element = this._dom.createElement('details', 'lh-details'); 61 const element = this._dom.createElement('details', 'lh-details');
74 if (list.header) { 62 if (list.header) {
75 const summary = this._dom.createElement('summary', 'lh-list__header'); 63 const summary = this._dom.createElement('summary', 'lh-list__header');
76 summary.textContent = list.header.text; 64 summary.textContent = list.header.text;
77 element.appendChild(summary); 65 element.appendChild(summary);
78 } 66 }
79 67
80 const itemsElem = this._dom.createElement('div', 'lh-list__items'); 68 const itemsElem = this._dom.createElement('div', 'lh-list__items');
81 const items = list.items || []; 69 for (const item of list.items) {
82 for (const item of items) {
83 itemsElem.appendChild(this.render(item)); 70 itemsElem.appendChild(this.render(item));
84 } 71 }
85 element.appendChild(itemsElem); 72 element.appendChild(itemsElem);
86 return element; 73 return element;
87 } 74 }
88 75
89 /** 76 /**
90 * @param {!DetailsRenderer.CardsDetailsJSON} details 77 * @param {!DetailsRenderer.CardsDetailsJSON} details
91 * @return {!Element} 78 * @return {!Element}
92 */ 79 */
(...skipping 19 matching lines...) Expand all
112 } 99 }
113 } 100 }
114 101
115 element.appendChild(cardsParent); 102 element.appendChild(cardsParent);
116 return element; 103 return element;
117 } 104 }
118 } 105 }
119 106
120 if (typeof module !== 'undefined' && module.exports) { 107 if (typeof module !== 'undefined' && module.exports) {
121 module.exports = DetailsRenderer; 108 module.exports = DetailsRenderer;
109 } else {
110 self.DetailsRenderer = DetailsRenderer;
122 } 111 }
123 112
124 /** 113 /**
125 * @typedef {{ 114 * @typedef {{
126 * type: string, 115 * type: string,
127 * text: (string|undefined), 116 * text: (string|undefined)
128 * header: (!DetailsRenderer.DetailsJSON|undefined),
129 * items: (!Array<!DetailsRenderer.DetailsJSON>|undefined)
130 * }} 117 * }}
131 */ 118 */
132 DetailsRenderer.DetailsJSON; // eslint-disable-line no-unused-expressions 119 DetailsRenderer.DetailsJSON; // eslint-disable-line no-unused-expressions
133 120
121 /**
122 * @typedef {{
123 * type: string,
124 * header: ({text: string}|undefined),
125 * items: !Array<{type: string, text: (string|undefined)}>
126 * }}
127 */
128 DetailsRenderer.ListDetailsJSON; // eslint-disable-line no-unused-expressions
129
134 /** @typedef {{ 130 /** @typedef {{
135 * type: string, 131 * type: string,
136 * text: string, 132 * header: ({text: string}|undefined),
137 * header: !DetailsRenderer.DetailsJSON,
138 * items: !Array<{title: string, value: string, snippet: (string|undefined), target: string}> 133 * items: !Array<{title: string, value: string, snippet: (string|undefined), target: string}>
139 * }} 134 * }}
140 */ 135 */
141 DetailsRenderer.CardsDetailsJSON; // eslint-disable-line no-unused-expressions 136 DetailsRenderer.CardsDetailsJSON; // eslint-disable-line no-unused-expressions
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698