Sanitizer + Refactoring

mbrodesser-Igalia · Jun 28, 2021 · 45a2b17 · 45a2b17
1 parent 9bca010
commit 45a2b17
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 10 deletions.
diff --git a/bin/fetch.py b/bin/fetch.py
@@ -71,7 +71,8 @@
     "fetch-metadata": {},
     "tt":   {},
     "sri":  {},
-    "sandbox": {}
+    "sandbox": {},
+    "sanitizer": {},
 }
 
 def getWPTRunIDs():
@@ -91,7 +92,7 @@ def getWPTSearchData(run_ids):
 for item in search_data["runs"]:
     browser_labels.append(item["browser_name"])
     for test_type in wpt_data.keys():
-        wpt_data[test_type][item["browser_name"]] = { "passed": 0, "total": 0 }
+        wpt_data[test_type][item["browser_name"]] = { "passed": 0, "total": 0, "percent": 0 }
 
 for item in search_data["results"]:
     test_type = None
@@ -109,6 +110,8 @@ def getWPTSearchData(run_ids):
         test_type = "tt"
     elif item["test"].startswith("/subresource-integrity/"):
         test_type = "sri"
+    elif item["test"].startswith("/sanitizer-api/"):
+        test_type = "sanitizer"
     elif "sandbox" in item["test"].lower():
         test_type = "sandbox"
     else:
@@ -117,6 +120,12 @@ def getWPTSearchData(run_ids):
     for i, status in enumerate(item["legacy_status"]):
         wpt_data[test_type][browser_labels[i]]["passed"] += status["passes"]
         wpt_data[test_type][browser_labels[i]]["total"] += status["total"]
+        if wpt_data[test_type][browser_labels[i]]["total"] == 0:
+            wpt_data[test_type][browser_labels[i]]["percent"] = 0
+        else:
+            wpt_data[test_type][browser_labels[i]]["percent"] = (
+                wpt_data[test_type][browser_labels[i]]["passed"] /
+                wpt_data[test_type][browser_labels[i]]["total"])
 
 #
 # Step 3: Render some HTML.

diff --git a/bin/template.html b/bin/template.html
@@ -1,12 +1,12 @@
 <!DOCTYPE html>
 {% macro itemToClass(item) -%}
-  {% if (item["passed"] / item["total"]) < 0.25 %}
+  {% if item["percent"] < 0.25 %}
   passes-few
-  {% elif (item["passed"] / item["total"]) < 0.50 %}
+  {% elif item["percent"] < 0.50 %}
   passes-some
-  {% elif (item["passed"] / item["total"]) < 0.75 %}
+  {% elif item["percent"] < 0.75 %}
   passes-many
-  {% elif (item["passed"] / item["total"]) < 0.95 %}
+  {% elif item["percent"] < 0.95 %}
   passes-most
   {% else %}
   passes-all
@@ -24,7 +24,7 @@
           <tbody>
             <tr>
               {% for browser, item in wpt_data[feature].items() %}
-              <td class="{{ itemToClass(item) | trim }}">{{ "{:.2%}".format(item["passed"] / item["total"]) }}</td>
+              <td class="{{ itemToClass(item) | trim }}">{{ "{:.2%}".format(item["percent"]) }}</td>
               {% endfor %}
             </tr>
           </tbody>
@@ -226,10 +226,28 @@ <h3>
         {{ wpt("fetch-metadata") }}
     </section>
   </article>
+
+  <article>
+    <h2 id="sanitizer-api">
+      <a href="#sanitizer-api">§</a>
+      HTML Sanitizer API
+    </h2>
+    <p>
+      TODO: Describe this.
+    </p>
+
+    <section>
+        <h3>
+          Web Platform Tests:
+          <a href="https://wpt.fyi/results/sanitizer-api?label=master&label=experimental&aligned"><code>/sanitizer-api</code></a>
+        </h3>
+        {{ wpt("sanitizer") }}
+    </section>
+  </article>
   <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/Chart.min.js" integrity="sha256-R4pqcOYV8lt7snxMQO/HSbVCFRPMdrhAFMH+vr9giYI=" crossorigin="anonymous" nonce="not-really-a-nonce"></script>
   <script src="https://cdn.jsdelivr.net/npm/[email protected]/chartjs-plugin-annotation.min.js" integrity="sha256-Olnajf3o9kfkFGloISwP1TslJiWUDd7IYmfC+GdCKd4=" crossorigin="anonymous" nonce="not-really-a-nonce"></script>
   <script nonce="not-really-a-nonce">
-    const colors = { red: "#e41a1c", blue: "#377eb8", green: "#4daf4a", orange: "#ff7f00", purple: "#984ea3", yellow: "#f6bf26" };
+    const colors = { deepSkyBlue: "#00bfff", orange: "#ff5400", limeGreen: "#32cd32", purple: "#984ea3", crimson: "#dc143c", steelBlue: "#4682b4", brown: "#a52a2a" };    
     const use_counter_days = {{ use_counter_days|tojson }};
     const use_counter_buckets = {{ use_counter_buckets|tojson }}
 
@@ -270,6 +288,9 @@ <h3>
           }
         ]
       },
+      animation: {
+        duration: 0
+      },
       annotation: { annotations: annotations }
     };
 
@@ -369,10 +390,10 @@ <h3>
         options: chart_options,
         data: {
           labels: use_counter_days,
-          datasets: c.data.map(d => {
+          datasets: c.data.map((d, i) => {
             return {
               label: d.label,
-              borderColor: colors[d.color],
+              borderColor: colors[Object.keys(colors)[i]],
               data: use_counter_buckets[d.useCounter + ""]
             };
           })

diff --git a/style.css b/style.css
@@ -87,3 +87,8 @@
       font-family: monospace;
       color: #52cbff;
     }
+
+canvas {
+  width: 750px;
+  height: 375px;
+}