OLD | NEW |
---|---|
(Empty) | |
1 <!DOCTYPE html> | |
2 <script src="../../resources/run-after-layout-and-paint.js"></script> | |
3 <svg> | |
4 <linearGradient id="f"> | |
5 <stop stop-color="green"/> | |
6 </linearGradient> | |
7 <rect width="100" height="100" fill="url(#f) orange"/> | |
8 </svg> | |
9 <script> | |
10 runAfterLayoutAndPaint(function() { | |
11 const svgNs = 'http://www.w3.org/2000/svg'; | |
12 let gradient = document.createElementNS(svgNs, 'linearGradient'); | |
13 let stop = gradient.appendChild(document.createElementNS(svgNs, 'stop')); | |
14 stop.setAttribute('stop-color', 'red'); | |
15 gradient.id = 'f'; | |
16 | |
17 let rect = document.querySelector('rect'); | |
18 document.querySelector('svg').insertBefore(gradient, rect); | |
Stephen Chennney
2017/02/27 16:21:22
Another test could be done, where the added elemen
fs
2017/02/27 17:47:29
Done.
| |
19 rect.getBoundingClientRect(); | |
20 rect.setAttribute('stroke-width', 0); | |
Stephen Chennney
2017/02/27 16:21:22
Why do you do this? Invalidation bug?
fs
2017/02/27 17:47:29
This is here to trigger style-recalc. (Needed to m
| |
21 }, true); | |
22 </script> | |
OLD | NEW |