Issue 2148 - Rewrite the testpages test suite

pages/filters/webrtc.tmpl

-title = $webrtc - ABP Test Pages
+title = $webrtc
 template = testcase
 
 {% set testcase_moreinfo = [
   ("Filter Options", "https://adblockplus.org/filters#options"),
 ] %}
 
 
 <script>
 
 // Borrowed from https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Simple_RTCDataChannel_sample
 
-function pagelog(message) {
-  var log = document.getElementById("testcase-fo-webrtc");
-  log.innerText = log.innerText + message + "\n";
-  console.log(message);
-}
-
 function handleReceiveMessage(event) {
   pagelog(event.data);
 }
 
 function handleLocalAddCandidateSuccess() {
   pagelog("handleLocalAddCandidateSuccess()")
 }
- 
+
 function handleRemoteAddCandidateSuccess() {
   pagelog("handleRemoteAddCandidateSuccess()")
 }
 
 function handleReceiveChannelStatusChange(event) {
   if (receiveChannel) {
     pagelog("Receive channel's status has changed to " + receiveChannel.readyState);
   }
 }
 
 function handleSendChannelStatusChange(event) {
   if (sendChannel) {
     var state = sendChannel.readyState;
-    
+
     if (state === "open") {
       pagelog("handleSendChannelStatusChange() open")
       sendChannel.send("Test Message");
     } else {
       pagelog("handleSendChannelStatusChange() not open")
     }
   }
 }
 
 function receiveChannelCallback(event) {
@@ skipping 29 matching lines @@
     .then(() => localConnection.setRemoteDescription(remoteConnection.localDescription))
     .catch(handleCreateDescriptionError);
 }
 
 document.addEventListener('DOMContentLoaded', do_connect, false);
 </script>
 
 <section class="site-panel">
   <h2>$webrtc</h2>
   <p>Check that usage of the $webrtc filter option works as expected.</p>
+  <p>With the filter displayed below each test case added to ABP (or with the testcase subscription installed and active), the WebRTC connection should be blocked.</p>
+  <p>Note: This test does not work correctly yet.</p>
 </section>
 
 <section class="site-panel">
   <h2>Test case</h2>
   <div class="testcase-container">
     <div class="testcase-row">
-      <h3>WebRTC Request</h3><div id="testcase-fo-webrtc"></div>
+      <h3>WebRTC Request</h3><div id="testcase-output"></div>
     </div>
   </div>
   <h3>Filters</h3>
-  $webrtc,domain=testpages.adblockplus.org
+  <pre>$webrtc,domain=testpages.adblockplus.org</pre>
 </section>