| <!doctype html> |
| <script> |
| function resize() { |
| const target = document.getElementById("div"); |
| const result = document.getElementById("result"); |
| |
| function handleResize (records) { |
| for (const r of records) { |
| result.textContent += `\n\n${r.type}, ${r.attributeName}, ${r.oldValue}`; |
| } |
| } |
| |
| const observer = new MutationObserver(handleResize); |
| observer.observe(target, { attributes: true, attributeOldValue: true, attributeFilter: ['style'] }); |
| |
| const x = document.body.offsetLeft + target.offsetLeft + target.offsetWidth; |
| const y = document.body.offsetTop + target.offsetTop + target.offsetHeight; |
| eventSender.mouseMoveTo(x - 6, y - 7); |
| eventSender.mouseDown(); |
| eventSender.mouseMoveTo(x + 13, y + 14); |
| eventSender.mouseUp(); |
| } |
| function test() { |
| if (!window.testRunner) |
| return; |
| |
| window.testRunner.dumpAsText(); |
| resize(); |
| } |
| </script> |
| </head> |
| <body onload="test()"> |
| <div id="div" style="overflow: auto; resize: both; width: 150px; height: 100px; border: blue 2px solid;"></div> |
| <pre id="result">Style attribute change observed:</pre> |
| </body> |
