<html>

    <head>

      <base href="https://bugs.webkit.org/" />

    </head>

    <body><table border="1" cellspacing="0" cellpadding="8">

        <tr>

          <th>Bug ID</th>

          <td><a class="bz_bug_link 

          bz_status_NEW "

   title="NEW - Page does not update when &lt;link&gt; media attribute changes to no longer apply to page"

   href="https://bugs.webkit.org/show_bug.cgi?id=148392">148392</a>

          </td>

        </tr>

        <tr>

          <th>Summary</th>

          <td>Page does not update when &lt;link&gt; media attribute changes to no longer apply to page

          </td>

        </tr>

        <tr>

          <th>Classification</th>

          <td>Unclassified

          </td>

        </tr>

        <tr>

          <th>Product</th>

          <td>WebKit

          </td>

        </tr>

        <tr>

          <th>Version</th>

          <td>WebKit Nightly Build

          </td>

        </tr>

        <tr>

          <th>Hardware</th>

          <td>Unspecified

          </td>

        </tr>

        <tr>

          <th>OS</th>

          <td>Unspecified

          </td>

        </tr>

        <tr>

          <th>Status</th>

          <td>NEW

          </td>

        </tr>

        <tr>

          <th>Severity</th>

          <td>Normal

          </td>

        </tr>

        <tr>

          <th>Priority</th>

          <td>P2

          </td>

        </tr>

        <tr>

          <th>Component</th>

          <td>CSS

          </td>

        </tr>

        <tr>

          <th>Assignee</th>

          <td>webkit-unassigned&#64;lists.webkit.org

          </td>

        </tr>

        <tr>

          <th>Reporter</th>

          <td>joepeck&#64;webkit.org

          </td>

        </tr>

        <tr>

          <th>CC</th>

          <td>benjamin&#64;webkit.org, simon.fraser&#64;apple.com

          </td>

        </tr></table>

      <p>

        <div>

        <pre>* SUMMARY

Page does not update when &lt;link&gt; media attribute changes to no longer apply to page.

* TEST

&lt;link id=&quot;link&quot; rel=&quot;stylesheet&quot; href=&quot;data:text/css,body{color:red}&quot; media=&quot;print&quot;&gt;

&lt;p&gt;Text To Change Color&lt;/p&gt;

&lt;button id=&quot;button&quot;&gt;Then Click me&lt;/button&gt;

&lt;script&gt;

document.getElementById(&quot;button&quot;).addEventListener(&quot;click&quot;, function() {

    var link = document.getElementById(&quot;link&quot;);

    var currentMedia = link.media;

    var newMedia = currentMedia === &quot;screen&quot; ? &quot;print&quot; : &quot;screen&quot;;

    console.log(currentMedia + &quot; =&gt; &quot; + newMedia);

    link.setAttribute(&quot;media&quot;, newMedia);

});

&lt;/script&gt;

* STEPS TO REPRODUCE

1. Load test

2. Click the button (note the text changes from black =&gt; red)

3. Click the button again

  =&gt; text does not change from red =&gt; black, but it should

* NOTES

- Chrome and Firefox both behave as expected with this test case</pre>

        </div>

      </p>

      <hr>

      <span>You are receiving this mail because:</span>

      <ul>

          <li>You are the assignee for the bug.</li>

      </ul>

    </body>

</html>