replaced CSS hack by JS solution

I tested it with Firefox 68.0.1 and Chromium 76.0.3809.87 on Linux.
w3c · Aug 8, 2019 · 191ed0e · 191ed0e
1 parent e4bcc78
commit 191ed0e
Showing 1 changed file with 44 additions and 10 deletions.
diff --git a/index.html b/index.html
@@ -273,16 +273,51 @@
     padding-left: 2em;
     font-style: italic;
   }
+</style>
+<script>
+  (function() {
+    function beforePrint() {
+      console.debug("opening details before printing");
+      var algoDetails = document.querySelectorAll('.algorithm details');
+      var c = 0;
+      for (var dt of algoDetails) {
+
+        if (!dt.open) {
+          dt.setAttribute("data-was-closed", "");
+          dt.open = true;
+          c += 1;
+        }
+      }
+      console.debug(c, "details opended before printing");
+    }
 
-  /* required if we chose to put OLs *outside* the details,
-     to force them visible when printing */
-  @media screen {
-    .algorithm details:not([open]) + ol {
-      display: none;
+    function afterPrint() {
+      console.debug("closing details after printing");
+      var algoDetails = document.querySelectorAll('.algorithm details');
+      var c = 0;
+      for (var dt of algoDetails) {
+        if (dt.hasAttribute("data-was-closed")) {
+          dt.removeAttribute("data-was-closed");
+          dt.open = false;
+          c += 1;
+        }
+      }
+      console.debug(c, "details closed after printing");
     }
-  }
 
-</style>
+    // using matchMedia
+    window.matchMedia('print').addListener(function (mql) {
+      if (mql.matches) {
+        beforePrint();
+      } else {
+        afterPrint();
+      }
+    });
+    // using events
+    window.addEventListener('beforeprint', beforePrint);
+    window.addEventListener('afterprint', afterPrint);
+  })();
+</script>
 </head>
 
 <body>
@@ -1143,8 +1178,7 @@ <h3>Algorithm</h3>
           For each item <var>context</var> in <var>local context</var>:
           <ol>
             <li>If <var>context</var> is <code>null</code>:
-              <details><summary>clear context (unless protected)</summary></details>
-              <ol>
+              <details><summary>clear context (unless protected)</summary><ol>
                 <li class="changed">If <var>override protected</var> is <code>false</code> and <var>active context</var>
                   contains any <a>protected</a> <a>term definitions</a>,
                   an <a data-link-for="JsonLdErrorCode">invalid context nullification</a>
@@ -1157,7 +1191,7 @@ <h3>Algorithm</h3>
                   <span class="note">In [[[JSON-LD]]], the <a>base IRI</a> was given
                     a default value here; this is now described conditionally
                     in <a href="#the-application-programming-interface" class="sectionRef"></a>.</span></li>
-              </ol>
+              </ol></details>
             </li>
             <li>If <var>context</var> is a <a>string</a>:
               <details><summary>dereference and process</summary><ol>