| <!DOCTYPE html> |
| <script src="resources/responsive-test.js"></script> |
| <script> |
| assertSVGResponsive({ |
| targetTag: 'path', |
| property: 'd', |
| getter(target) { |
| return getComputedStyle(target).getPropertyValue('d'); |
| }, |
| from: 'm 10 10 h 100', |
| to: neutralKeyframe, |
| configurations: [{ |
| state: {underlying: 'M 30 30 H 250'}, |
| expect: [ |
| {at: 0.25, is: 'M 15 15 H 145'}, |
| {at: 0.75, is: 'M 25 25 H 215'}, |
| ], |
| }, { |
| state: {underlying: 'm 30 30 h 200'}, |
| expect: [ |
| {at: 0.25, is: 'm 15 15 h 125'}, |
| {at: 0.75, is: 'm 25 25 h 175'}, |
| ], |
| }, { |
| state: {underlying: 'M 30 30 L 100 100'}, |
| expect: [ |
| {at: 0.25, is: 'm 10 10 h 100'}, |
| {at: 0.75, is: 'M 30 30 L 100 100'}, |
| ], |
| }], |
| }); |
| |
| assertSVGResponsive({ |
| targetTag: 'path', |
| property: 'd', |
| getter(target) { |
| return getComputedStyle(target).getPropertyValue('d'); |
| }, |
| from: '', |
| to: neutralKeyframe, |
| configurations: [{ |
| state: {underlying: 'm 10 10 h 100'}, |
| expect: [ |
| {at: 0.25, is: ''}, |
| {at: 0.75, is: 'm 10 10 h 100'}, |
| ], |
| }], |
| }); |
| </script> |
