From a436102ff779531eab9ae32ce5ae03cd415f1a06 Mon Sep 17 00:00:00 2001
From: Raymond Hill <rhill@raymondhill.net>
Date: Sat, 22 Jun 2019 16:41:42 -0400
Subject: [PATCH] Add test case for `:watch-attr`

---
 docs/tests/procedural-cosmetic-filters.html | 17 ++++++++++++++++-
 docs/tests/procedural-html-filters.html     |  3 ++-
 2 files changed, 18 insertions(+), 2 deletions(-)
diff --git a/docs/tests/procedural-cosmetic-filters.html b/docs/tests/procedural-cosmetic-filters.html
index 3aa55c1c3..ad01f9514 100644
--- a/docs/tests/procedural-cosmetic-filters.html
+++ b/docs/tests/procedural-cosmetic-filters.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
 <head>
+<meta charset="utf-8">
 <title>Procedural cosmetic filters</title>
 <style>
     .filters {
@@ -25,7 +26,7 @@
         justify-content: center;
     }
     .tile > div {
-        height: 100px;
+        height: 50px;
         position: relative;
     }
     .tile > div > div {
@@ -141,6 +142,20 @@
     <code>#pcf #a14 .pass > a:has(b) + .fail:has(b)</code>
     </div>
 
+<div id="a15" class="tile">
+    <div class="pass"><div class="pass"><a><b class="ok"></b></a></div></div>
+    <code>#pcf #a15 .pass:watch-attrs(class) > .fail:has(b.notok)</code>
+    <script>
+        self.setTimeout(( ) =>
+            {
+                document.querySelector('#a15 .pass > .pass').className = 'fail';
+                document.querySelector('#a15 .pass > .fail b.ok').className = 'notok';
+            },
+            500
+        );
+    </script>
+    </div>
+
 </div>
 
 <script>
diff --git a/docs/tests/procedural-html-filters.html b/docs/tests/procedural-html-filters.html
index 3309d1eab..2b32f0559 100644
--- a/docs/tests/procedural-html-filters.html
+++ b/docs/tests/procedural-html-filters.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
 <head>
+<meta charset="utf-8">
 <title>Procedural HTML filters</title>
 <style>
     .filters {
@@ -25,7 +26,7 @@
         justify-content: center;
     }
     .tile > div {
-        height: 100px;
+        height: 50px;
         position: relative;
     }
     .tile > div > div {
