| Summary: | Backdrop Filter should repaint when changed via script | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Joseph Pecoraro <joepeck> | ||||||
| Component: | WebCore Misc. | Assignee: | Simon Fraser (smfr) <simon.fraser> | ||||||
| Status: | RESOLVED FIXED | ||||||||
| Severity: | Normal | CC: | commit-queue, ddkilzer, dino, esprehn+autocc, glenn, joepeck, kondapallykalyan, l.m, matt, simon.fraser, webkit-bug-importer | ||||||
| Priority: | P2 | Keywords: | InRadar | ||||||
| Version: | WebKit Nightly Build | ||||||||
| Hardware: | Unspecified | ||||||||
| OS: | Unspecified | ||||||||
| Bug Depends on: | |||||||||
| Bug Blocks: | 156133 | ||||||||
| Attachments: |
|
||||||||
*** Bug 155794 has been marked as a duplicate of this bug. *** Created attachment 275445 [details]
Testcase
Created attachment 275446 [details]
Patch
Nice! (In reply to comment #5) > https://trac.webkit.org/r198963 New test is failing on most bots: <http://webkit-test-results.webkit.org/dashboards/flakiness_dashboard.html#showAllRuns=true&tests=css3%2Ffilters%2Fbackdrop%2Fdynamic-backdrop-filter-change.html> (In reply to comment #7) > (In reply to comment #5) > > https://trac.webkit.org/r198963 > > New test is failing on most bots: > > <http://webkit-test-results.webkit.org/dashboards/flakiness_dashboard.html#showAllRuns=true&tests=css3%2Ffilters%2Fbackdrop%2Fdynamic-backdrop-filter-change.html> Tried to fix: Committed r198971: <http://trac.webkit.org/r198971> |
* SUMMARY Backdrop Filter should repaint when changed via script. * TEST <style> .back { width: 300px; height: 150px; margin: 100px; background: blue; } .top { width: 1000px; height: 50px; position: absolute; left: 0; top: 150px; -webkit-backdrop-filter: blur(50px); } </style> <div class="back"> <div id="x" class="top"></div> </div> <button id="a">Blur 10</button> <button id="b">Blur -10</button> <button id="c">Blur 50</button> <button id="d">Show / Hide the element</button> <script> a.onclick = function() { x.style.webkitBackdropFilter = "blur(10px)"; } b.onclick = function() { x.style.webkitBackdropFilter = "blur(-10px)"; } c.onclick = function() { x.style.webkitBackdropFilter = "blur(50px)"; } d.onclick = function() { x.hidden = !x.hidden; } </script> * STEPS TO REPRODUCE 1. Show test 2. Click on one of the Blur buttons to change the blur => nothing happens, expected the element to repaint 3. Click the button to hide the blur element 3. Click the button to show the blur element => blur is now updated