| <!DOCTYPE html> |
| <script src="resources/responsive-test.js"></script> |
| <script> |
| assertCSSResponsive({ |
| property: 'border-image-slice', |
| from: neutralKeyframe, |
| to: '110 120%', |
| configurations: [{ |
| state: {underlying: '10 20%'}, |
| expect: [ |
| {at: 0.25, is: '35 45%'}, |
| {at: 0.75, is: '85 95%'}, |
| ], |
| }, { |
| state: {underlying: '10 20% fill'}, |
| expect: [ |
| {at: 0.25, is: '10 20% fill'}, |
| {at: 0.75, is: '110 120%'}, |
| ], |
| }, { |
| state: {underlying: '10% 20'}, |
| expect: [ |
| {at: 0.25, is: '10% 20'}, |
| {at: 0.75, is: '110 120%'}, |
| ], |
| }], |
| }); |
| |
| assertCSSResponsive({ |
| property: 'border-image-slice', |
| from: 'inherit', |
| to: '110 120% fill', |
| configurations: [{ |
| state: {inherited: '10 20% fill'}, |
| expect: [ |
| {at: 0.25, is: '35 45% fill'}, |
| {at: 0.75, is: '85 95% fill'}, |
| ], |
| }, { |
| state: {inherited: '10% 20 fill'}, |
| expect: [ |
| {at: 0.25, is: '10% 20 fill'}, |
| {at: 0.75, is: '110 120% fill'}, |
| ], |
| }, { |
| state: {inherited: '10 20%'}, |
| expect: [ |
| {at: 0.25, is: '10 20%'}, |
| {at: 0.75, is: '110 120% fill'}, |
| ], |
| }], |
| }); |
| </script> |
