Add Tracking Vector Text metadata

And align with defaults used in whatwg/wattsi#41.

bikeshed/fingerprinting.py

@@ -29,14 +29,13 @@ def addTrackingVector(doc):
 
 	for el in els:
 		prependChild(el,
-			trackingVectorImage(doc.md.trackingVectorImage, doc.md.trackingVectorTitle, doc.md.trackingVectorClass))
+			trackingVectorImage(doc.md.trackingVectorImage, doc.md.trackingVectorAltText, doc.md.trackingVectorTitle, doc.md.trackingVectorClass))
 		removeAttr(el, "tracking-vector")
 
-
-def trackingVectorImage(url, title, cls):
+def trackingVectorImage(url, altText, title, cls):
 	if url is None:
-		return E.svg({"width":"46", "height":"64", "role":"img", "class": cls},
+		return E.svg({"width":"46", "height":"64", "role":"img", "aria-label":altText, "class":cls},
 			E.title({}, title),
 			E.use({"href":"#"+trackingVectorId}))
 	else:
-		return E.img({"title":title, "alt":title, "src":url, "class": cls})
+		return E.img({"title":title, "alt":altText, "src":url, "class":cls})

bikeshed/metadata.py

@@ -69,7 +69,8 @@ def __init__(self):
         self.favicon = None
         self.trackingVectorClass = "tracking-vector"
         self.trackingVectorImage = None
-        self.trackingVectorTitle = "There is a potential tracking vector here."
+        self.trackingVectorAltText = "(This is a tracking vector.) " # The space is to separate from the following text.
+        self.trackingVectorTitle = "There is a tracking vector here."
         self.forceCrossorigin = False
         self.group = None
         self.h1 = None
@@ -1022,6 +1023,7 @@ def parseLiteralList(key, val, lineNum):
     "TR": Metadata("TR", "TR", joinValue, parseLiteral),
     "Tracking Vector Class": Metadata("Tracking Vector Class", "trackingVectorClass", joinValue, parseLiteralOrNone),
     "Tracking Vector Image": Metadata("Tracking Vector Image", "trackingVectorImage", joinValue, parseLiteralOrNone),
+    "Tracking Vector Alt Text": Metadata("Tracking Vector Alt Text", "trackingVectorAltText", joinValue, parseLiteral),
     "Tracking Vector Title": Metadata("Tracking Vector Title", "trackingVectorTitle", joinValue, parseLiteral),
     "Translate Ids": Metadata("Translate Ids", "translateIDs", joinDdList, parseTranslateIDs),
     "Translation": Metadata("Translation", "translations", joinList, parseTranslation),

tests/fingerprint001.html

@@ -179,11 +179,11 @@ <h2 class="no-num no-toc no-ref" id="contents">Table of Contents</h2>
   <main>
    <p>Here’s some text.</p>
    <p>
-    <svg class="tracking-vector" height="64" role="img" width="46">
-     <title>There is a potential tracking vector here.</title>
+    <svg aria-label="(This is a tracking vector.) " class="tracking-vector" height="64" role="img" width="46">
+     <title>There is a tracking vector here.</title>
      <use href="#b732b3fe"></use>
     </svg>
-    Some more text that fingerprints! 
+    Some more text that fingerprints!
    </p>
    <p>And then some more after that.</p>
   </main>

tests/fingerprint003.bs

@@ -5,14 +5,14 @@ Shortname: foo
 Level: 1
 Status: LS
 ED: http://example.com/foo
-Abstract: Testing that 'Fingerprint Class: foo' works.
+Abstract: Testing that 'Tracking Vector Class: foo' works.
 Tracking Vector Class: foo
 Editor: Example Editor
 Date: 1970-01-01
 </pre>
 
 Here's some text.
 
-<p tracking-vector>Some text that fingerprints.
+<p tracking-vector>Some text that tracks.
 
 And then some more after that.

tests/fingerprint003.html

@@ -170,7 +170,7 @@ <h2 class="no-num no-toc no-ref heading settled" id="subtitle"><span class="cont
   </div>
   <div class="p-summary" data-fill-with="abstract">
    <h2 class="no-num no-toc no-ref heading settled" id="abstract"><span class="content">Abstract</span></h2>
-   <p>Testing that 'Fingerprint Class: foo' works.</p>
+   <p>Testing that 'Tracking Vector Class: foo' works.</p>
   </div>
   <div data-fill-with="at-risk"></div>
   <nav data-fill-with="table-of-contents" id="toc">
@@ -179,11 +179,11 @@ <h2 class="no-num no-toc no-ref" id="contents">Table of Contents</h2>
   <main>
    <p>Here’s some text.</p>
    <p>
-    <svg class="foo" height="64" role="img" width="46">
-     <title>There is a potential tracking vector here.</title>
+    <svg aria-label="(This is a tracking vector.) " class="foo" height="64" role="img" width="46">
+     <title>There is a tracking vector here.</title>
      <use href="#b732b3fe"></use>
     </svg>
-    Some text that fingerprints. 
+    Some text that tracks.
    </p>
    <p>And then some more after that.</p>
   </main>

tests/fingerprint004.html

@@ -178,6 +178,6 @@ <h2 class="no-num no-toc no-ref" id="contents">Table of Contents</h2>
   </nav>
   <main>
    <p>Here’s some text.</p>
-   <p><img alt="There is a potential tracking vector here." class="tracking-vector" src="https://xanthir.com/pony" title="There is a potential tracking vector here.">Some text that fingerprints! </p>
+   <p><img alt="(This is a tracking vector.) " class="tracking-vector" src="https://xanthir.com/pony" title="There is a tracking vector here.">Some text that fingerprints! </p>
    <p>And then some more after that.</p>
   </main>

tests/fingerprint005.html

@@ -179,11 +179,11 @@ <h2 class="no-num no-toc no-ref" id="contents">Table of Contents</h2>
   <main>
    <p>Here’s some text.</p>
    <p>
-    <svg class="tracking-vector" height="64" role="img" width="46">
-     <title>There is a potential tracking vector here.</title>
+    <svg aria-label="(This is a tracking vector.) " class="tracking-vector" height="64" role="img" width="46">
+     <title>There is a tracking vector here.</title>
      <use href="#b732b3fe"></use>
     </svg>
-    Some text that fingerprints! 
+    Some text that fingerprints!
    </p>
    <p>And then some more after that.</p>
   </main>

tests/fingerprint006.html

@@ -179,11 +179,11 @@ <h2 class="no-num no-toc no-ref" id="contents">Table of Contents</h2>
   <main>
    <p>Here’s some text.</p>
    <p>
-    <svg class="tracking-vector" height="64" role="img" width="46">
+    <svg aria-label="(This is a tracking vector.) " class="tracking-vector" height="64" role="img" width="46">
      <title>A custom Tracking Vector title, &lt;script>alert("xss")&lt;/script>.</title>
      <use href="#b732b3fe"></use>
     </svg>
-    Some text that fingerprints! 
+    Some text that fingerprints!
    </p>
    <p>And then some more after that.</p>
   </main>