Generate audit options in extension from configJSON

Author: wardpeet

lighthouse-extension/app/popup.html

@@ -52,20 +52,9 @@ <h2 class="header-titles__url">...</h2>
   <aside class="options subpage">
     <h2 class="options__title">Options</h2>
     <ul class="options__list">
-        <li><label><input type="checkbox" checked="checked" value="App can load on offline/flaky connections" />App can load on offline/flaky connections</label></li>
-        <li><label><input type="checkbox" checked="checked" value="Page load performance is fast" />Page load performance</label></li>
-        <li><label><input type="checkbox" checked="checked" value="Site is progressively enhanced" />Site is progressively enhanced</label></li>
-        <li><label><input type="checkbox" checked="checked" value="Network connection is secure" />Network connection is secure</label></li>
-        <li><label><input type="checkbox" checked="checked" value="User can be prompted to Add to Homescreen" />User can be prompted to Add to Homescreen</label></li>
-        <li><label><input type="checkbox" checked="checked" value="Installed web app will launch with custom splash screen" />Installed web app will launch with custom splash screen</label></li>
-        <li><label><input type="checkbox" checked="checked" value="Address bar matches brand colors" />Address bar matches brand colors</label></li>
-        <li><label><input type="checkbox" checked="checked" value="Design is mobile-friendly" />Design is mobile-friendly</label></li>
-        <li><label>&nbsp;</li>
-        <li><label><input type="checkbox" checked="checked" value="Best Practices" /><label for="bestpractices">Best Practices</label></li>
-        <li><label><input type="checkbox" checked="checked" value="Performance Metrics" /><label for="performance">Performance Metrics</label></li>
     </ul>
 
-    <button class="button button--link button--go-back" id="go-back">Back</button>
+    <button class="button button--link button--ok" id="ok">OK</button>
   </aside>
 
   <script src="scripts/popup.js"></script>

lighthouse-extension/app/src/popup.js

@@ -46,7 +46,7 @@ document.addEventListener('DOMContentLoaded', _ => {
   const generateOptionsEl = document.getElementById('configure-options');
   const optionsEl = document.body.querySelector('.options');
   const optionsList = document.body.querySelector('.options__list');
-  const goBack = document.getElementById('go-back');
+  const okButton = document.getElementById('ok');
 
   let spinnerAnimation;
 
@@ -138,7 +138,7 @@ document.addEventListener('DOMContentLoaded', _ => {
     optionsEl.classList.add(subpageVisibleClass);
   });
 
-  goBack.addEventListener('click', () => {
+  okButton.addEventListener('click', () => {
     optionsEl.classList.remove(subpageVisibleClass);
   });
 

lighthouse-extension/app/styles/lighthouse.css

@@ -149,7 +149,7 @@ body {
   text-decoration: underline;
 }
 
-.button--go-back {
+.button--ok {
   align-self: center;
 }