1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
|
id references title flags links revision credits assertion
clip-absolute-positioned-001 reference/clip-absolute-positioned-ref CSS Masking: Test clip property and rect function on div with position: absolute http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 409173b5030dca2e730a5178cfe96aa39318eafd `Dirk Schulze`<mailto:dschulze@adobe.com> The clip property should clip elements whose layout are governed by the CSS box model and that are abolutely positioned with 'position: absolute;'. On pass you should see a green square and no red.
clip-absolute-positioned-002 reference/clip-absolute-positioned-ref CSS Masking: Test clip property and rect function on div with position: fixed http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property a1d85c1f0fe74ac0be4b7e80f91ce06ea6448f8c `Dirk Schulze`<mailto:dschulze@adobe.com> The clip property should clip elements whose layout are governed by the CSS box model and that are abolutely positioned with 'position: fixed;'. On pass you should see a green square and no red.
clip-negative-values-001 reference/clip-full-ref CSS Masking: Test clip property does not clip on with negative values - 1 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property d1e93d5b38c68a6baeab8e97660c9bc0889f816f `Dirk Schulze`<mailto:dschulze@adobe.com> Negative values are permitted on rect function for clip. Test that whole element is clipped if bottom edge is before top edge. On pass you should see a green square and no red.
clip-negative-values-002 reference/clip-full-ref CSS Masking: Test clip property does not clip on with negative values - 2 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 735e876f76beb14687a30216a3c2e3900b23a450 `Dirk Schulze`<mailto:dschulze@adobe.com> Negative values are permitted on rect function for clip. Test that whole element is clipped if right edge is before left edge. On pass you should see a green square and no red.
clip-negative-values-003 reference/clip-vertical-stripe-ref CSS Masking: Test clip property does not clip on with negative values - 3 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property a86ea0edfa9599ebb1c0f77ef66bbaf066ab979f `Dirk Schulze`<mailto:dschulze@adobe.com> Negative values are permited on rect function for clip. Test that left edge can be negative. On pass you should see a vertical blue stripe.
clip-negative-values-004 reference/clip-horizontal-stripe-ref CSS Masking: Test clip property does not clip on with negative values - 4 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 2ba4b26ac53090ed12a58e8df45722b711d60f8a `Dirk Schulze`<mailto:dschulze@adobe.com> Negative values are permited on rect function for clip. Test that top edge can be negative. On pass you should see a horizontal blue stripe.
clip-no-clipping-001 reference/clip-no-clipping-ref CSS Masking: Test clip property does not clip on 'auto' http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 7912958fe93cbfee4813df84880a44d631a3b240 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip property should on 'auto'. On pass you should see a green box with a blue border.
clip-no-clipping-002 reference/clip-no-clipping-ref CSS Masking: Test clip property does not clip overflowing content on 'auto'. http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 6ff66041ca2cbd712ea96f3d5341d6ee725ed246 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip property should not clip overflowing content of elements whose layout are governed by the CSS box model, the position is absolute and the clip value is 'auto'. On pass you should see a a green square with a blue border.
clip-not-absolute-positioned-001 reference/clip-no-clipping-ref CSS Masking: Test clip property and rect function on not absolutely positioned div - 1 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 57e6de156814d186fcffb74693eef632e5f16ea0 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip property should be ignored on elements whose layout are governed by the CSS box model and are not abolutely positioned. On pass you should see a green square with a blue border.
clip-not-absolute-positioned-002 reference/clip-no-clipping-ref CSS Masking: Test clip property and rect function on not absolutely positioned div - 2 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property a6f6d6754d24efc6c66a83e4cac2f4375c7f12c2 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip property should be ignored on elements whose layout are governed by the CSS box model and are not abolutely positioned. Creating a stacking context with z-index does not influence clipping behavior. On pass you should see a green box square with a blue border.
clip-not-absolute-positioned-003 reference/clip-no-clipping-ref CSS Masking: Test clip property and rect function on not absolutely positioned div - 3 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 80b26530bb6e33ba2315e02ad4917fd3f4ddb5b6 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip property should be ignored on elements whose layout are governed by the CSS box model and are not abolutely positioned. Creating a 3d rednering context does not influence clipping behavior. On pass you should see a green square with a blue border.
clip-not-absolute-positioned-004 reference/clip-no-clipping-ref CSS Masking: Test clip property and rect function on not absolutely positioned div - 4 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 7f2d07caa51146f7f6fe33880a518a5cfeed73a3 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip property should be ignored on elements whose layout are governed by the CSS box model and are not abolutely positioned. position: relative does not influence clipping behavior. On pass you should see a green square with a blue border.
clip-path-circle-001 reference/clip-path-circle-ref CSS Masking: Test clip-path property and circle function with absolute values http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#the-clip-path 6551513b2e9c688ba790a5034cf56375b251c2c8 `Dirk Schulze`<mailto:dschulze@adobe.com>,`Denise White`<mailto:denisegwhite@outlook.com>,`Laury Kenton`<mailto:webshiva@mac.com> The clip-path property takes the basic shape 'circle' for clipping. Test absolute values for arguments. On pass you should see a green circle and no red.
clip-path-circle-002 reference/clip-path-circle-ref CSS Masking: Test clip-path property and circle function with percentage values http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#the-clip-path 5f834cbdfb22a1b7ead2a6601aa031c9b6e1b74b `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'circle' for clipping. Test percentage values for arguments. If no reference box was specified, percentage is relative to border-box. On pass there should be a green circle.
clip-path-circle-003 reference/clip-path-circle-ref CSS Masking: Test clip-path property and circle function with percentage radius http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#the-clip-path 9e5bd98775ead8fe688f521be1e25ff899e98672 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'circle' for clipping. Test percentage value as argument for radius and no position arguments. The circle should be in the center of the element. On pass there should be a green circle.
clip-path-circle-004 reference/clip-path-circle-ref CSS Masking: Test clip-path property and circle function with percentage position http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#the-clip-path 3cc1f0658ce477570d8dbe4836a4fe0456494a91 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'circle' for clipping. Test percentage value as argument for position and no radius argument. The circle must behave like it has a radius of 'closest-side'. On pass there should be a green circle.
clip-path-circle-005 reference/clip-path-circle-ref CSS Masking: Test clip-path property and circle function with closest-side http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#the-clip-path a59b8266454be39aa922b148836bf5a741169bf6 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'circle' for clipping. The circle has a radius of 'closest-side'. This test has a squred div-box. Therefore, 'closest-side', 50% and 'farthest-side' show the same behavior. On pass there should be a green circle.
clip-path-circle-006 reference/clip-path-circle-ref CSS Masking: Test clip-path property and circle function with farthest-side http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#the-clip-path ad47ecb4deda995ea69dec7ade4eeaec7f66651f `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'circle' for clipping. The circle has a radius of 'farthest-side'. This test has a squred div-box. Therefore, 'closest-side', 50% and 'farthest-side' show the same behavior. On pass there should be a green circle.
clip-path-circle-007 reference/clip-path-circle-2-ref CSS Masking: Test clip-path property and circle with closest-side on rectangular div 1 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#the-clip-path 84a1adff0763b0c5793d4a7910f66481747b961b `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'circle' for clipping. The clipped div box is twice as wide as it is height. With 'closest-side', there should be a full green circle.
clip-path-circle-008 reference/clip-path-circle-3-ref CSS Masking: Test clip-path property and circle with closest-side on rectangular div 2 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#the-clip-path 1e853c7eb2dd8220110fd26fa80e079587244fd9 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'circle' for clipping. The clipped div box is twice as high as it is wide. With 'closest-side', there should be a full green circle.
clip-path-element-userSpaceOnUse-001 reference/clip-path-rectangle-ref CSS Masking: Test clip-path property and external clipPath reference with userSpaceOnUse - 1 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path,http://www.w3.org/TR/css-masking-1/#ClipPathElement 675bc45a4da73f355ae54d1b371bc680e4d2e72e `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes an external reference to a clipPath element for clipping. On pass you should see a green box.
clip-path-element-userSpaceOnUse-002 reference/clip-path-rectangle-ref CSS Masking: Test clip-path property and external clipPath reference with userSpaceOnUse - 2 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path,http://www.w3.org/TR/css-masking-1/#ClipPathElement 26e3cc0e8acd806489c4731cf5a284621884efe6 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes an reference to a clipPath element for clipping. On pass you should see a green with a blue border.
clip-path-element-userSpaceOnUse-003 reference/clip-path-ref-right-green-ref CSS Masking: Test clip-path property and external clipPath reference with userSpaceOnUse with percentage - 1 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path,http://www.w3.org/TR/css-masking-1/#ClipPathElement 2f3f54dc854f6446db4f32e5feb72d3cefe04efb `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes a reference to a clipPath element for clipping. Percentage values are relative to the viewport for userSpaceOnUse on clipPathUnits. On pass the left half of the site is white and the right half of the site is blue.
clip-path-element-userSpaceOnUse-004 reference/clip-path-ref-bottom-green-ref CSS Masking: Test clip-path property and external clipPath reference with userSpaceOnUse with percentage - 2 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path,http://www.w3.org/TR/css-masking-1/#ClipPathElement 4e27c11182a66d338d7144fdb48c427355371381 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes a reference to a clipPath element for clipping. Percentage values are relative to the viewport for userSpaceOnUse on clipPathUnits. On pass the top half of the site is white and the bottom half of the site is green.
clip-path-ellipse-001 reference/clip-path-ellipse-ref CSS Masking: Test clip-path property and ellipse function with absolute values http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 012b35e9240dc2d23fc883bc66465468645963a9 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'ellipse' for clipping. Test absolute values for radii and position arguments. On pass you should see a green ellipse.
clip-path-ellipse-002 reference/clip-path-ellipse-ref CSS Masking: Test clip-path property and ellipse function with percentage values http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 01e03a3bb41b0e8366aba15f90aead78162a25b4 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'ellipse' for clipping. Test percentage values for radii and position arguments. Percentage values are relative to a reference box. If no reference box was specified, percentage values are relative to border-box. On pass you should see a green ellipse.
clip-path-ellipse-003 reference/clip-path-circle-ref CSS Masking: Test clip-path property and ellipse function with percentage values on square http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path a08442647cf371223db13dfe554e10c802709b67 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'ellipse' for clipping. Test percentage values for radii and position arguments. Percentage values are relative to a reference box. If no reference box was specified, percentage values are relative to border-box. On pass there should be a full green circle.
clip-path-ellipse-004 reference/clip-path-ellipse-ref CSS Masking: Test clip-path property and ellipse function with different absolute values on square http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 0ca0f3e14b0c9f17d22de8de547bbf9c292bdb04 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'ellipse' for clipping. Test absolute values for arguments. On pass you should see a green ellipse.
clip-path-ellipse-005 reference/clip-path-ellipse-ref CSS Masking: Test clip-path property and ellipse function with different percentage values on square http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 1d9b5e7dcc68d4d8a987bdd2875beae0745a2e74 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'ellipse' for clipping. Test percentage values for radii and position arguments. Percentage values are relative to a reference box. If no reference box was specified, percentage values are relative to border-box. Different values for getting an ellipse from a square. On pass you should see a green ellipse.
clip-path-ellipse-006 reference/clip-path-circle-ref CSS Masking: Test clip-path property and ellipse function with absolute values http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path e9f87ec9c0074f594df20b97307f7606927bdb15 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'ellipse' for clipping. Test absolute values for radii and position arguments. On pass you should see a green circle.
clip-path-ellipse-007 reference/clip-path-ellipse-ref CSS Masking: Test clip-path property and ellipse function with no arguments http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path b36748b51ddf5bdcb7d74b184c0c4160485e44cc `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'ellipse' for clipping. If no further arguments were specified, the radii are 'closest-side' each. The position is initialised to the center of the element. On pass there is a full green ellipse.
clip-path-ellipse-008 reference/clip-path-ellipse-ref CSS Masking: Test clip-path property and ellipse function with 50% 50% http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path e1bc5feb5b0e8a7234ef94a33d8521d8e60ad245 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'ellipse' for clipping. Test percentage values for radii and position arguments. Percentage values are relative to a reference box. If no reference box was specified, percentage values are relative to border-box. Both radii are specified with percentage values. The position is initialised to the center of the element. On pass there is a full green ellipse.
clip-path-polygon-001 reference/clip-path-rectangle-ref CSS Masking: Test clip-path property and polygon function with absolute values http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path ce40772a228f478895d17f511ede902285b20c9e `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'polygon' for clipping. Test absolute value arguments. On pass you should see a green square and no red.
clip-path-polygon-002 reference/clip-path-rectangle-ref CSS Masking: Test clip-path property and polygon function with percentage values http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path a26883e8648b91eb54278dc34910fd08fd768066 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'polygon' for clipping. Test percentage values for arguments. Percentage values are relative to specified reference box. If no reference box was specified, percentage values are relative to border-box. A number of percentage values are specified as coordinates. On pass you should see a green square and no red.
clip-path-polygon-003 reference/clip-path-rectangle-ref CSS Masking: Test clip-path property and polygon function with absolute and percentage values http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path fccf23845d5ec85f017a3e9785363549f51c6d4b `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'polygon' for clipping. Test absolute and percentage value arguments. On pass you should see a green square and no red.
clip-path-polygon-004 reference/clip-path-rectangle-border-ref CSS Masking: Test clip-path property and polygon function with fill rule evenodd http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 2d89915ec42470d0b282de73f171792540055f2c `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'polygon' for clipping. The point list for the polygon creates a 'whole' with the dimension of the background. With the fill rule 'evenodd', this whole is clipped out. The clipping makes the green background of the parent div box visible. On pass you should see a green box with a blue border.
clip-path-polygon-005 reference/clip-path-rectangle-border-ref CSS Masking: Test clip-path property and polygon function with fill rule nonzero http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path a23e6116b898f98d581ed671fab1d8eb7a2b2ff4 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property takes the basic shape 'polygon' for clipping. The point list for the polygon creates a 'hole' with the dimension of the background of the clipped element. With the fill rule 'nonzero', this hole is clipped out. The clipping makes the green background of the parent div box visible. On pass you should see a green square with a blue border.
clip-path-polygon-006 reference/clip-path-square-001-ref CSS Masking: Test clip-path and polygon with padding-box http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 46ade91baef9cd493a1d1006e63506901ecef137 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property allows specifying basic shapes and reference boxes. This test checks the usage of the correct reference box 'padding-box' for the polygon() function by mixing percentage and absolute values as coordinates. On sucess you should see a green square and no red.
clip-path-polygon-007 reference/clip-path-stripes-001-ref CSS Masking: Test clip-path and polygon with border-box http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path ababd340338c3a00f475253d3e70c68a46afa757 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property allows specifying basic shapes and reference boxes. This test checks the usage of the correct reference box 'border-box' for the polygon() function by mixing percentage and absolute values as coordinates. On sucess you should see a green vertical stripe next to a lime green vertical stripe. Both should be of equal size.
clip-path-polygon-008 reference/clip-path-stripes-002-ref CSS Masking: Test clip-path and polygon with margin-box http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 9f1f5e861afb82ce4535efa1e5e37c85bb961001 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property allows specifying basic shapes and reference boxes. This test checks the usage of the correct reference box 'margin-box' for the polygon() function by mixing percentage and absolute values as coordinates. On sucess you should see a green vertical stripe next to a lime green vertical stripe. Both should be of equal size.
clip-path-polygon-009 reference/clip-path-square-002-ref CSS Masking: Test clip-path and polygon with content-box http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path dbf06de6ee649d816c7f91522ba4c4991a96be1c `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property allows specifying basic shapes and reference boxes. This test checks the usage of the correct reference box 'content-box' for the polygon() function by mixing percentage and absolute values as coordinates. On sucess you should see a green square and no red.
clip-path-polygon-010 reference/clip-path-stripes-001-ref CSS Masking: Test clip-path and polygon with fill-box http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 1794303787a34ef7c061a247a9076fc9fd1adb49 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property allows specifying basic shapes and reference boxes. This test checks the usage of the correct reference box. 'fill-box' was specified but is not supported for HTML elements. The used value should be 'border-box' for the polygon() function instead. By mixing percentage and absolute values as coordinates we check the correct used reference box. On sucess you should see a green vertical stripe next to a lime green vertical stripe. Both should be of equal size.
clip-path-polygon-011 reference/clip-path-stripes-001-ref CSS Masking: Test clip-path and polygon with stroke-box http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path f2b7330ea6d4bb428d6c5e630e0c42ec523a7223 `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property allows specifying basic shapes and reference boxes. This test checks the usage of the correct reference box. 'stroke-box' was specified but is not supported for HTML elements. The used value should be 'border-box' for the polygon() function instead. By mixing percentage and absolute values as coordinates we check the correct used reference box. On sucess you should see a green vertical stripe next to a lime green vertical stripe. Both should be of equal size.
clip-path-polygon-012 reference/clip-path-stripes-001-ref CSS Masking: Test clip-path and polygon with view-box http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 618f339a009ce4209c17b1199aee514292a5e4ce `Dirk Schulze`<mailto:dschulze@adobe.com> The clip-path property allows specifying basic shapes and reference boxes. This test checks the usage of the correct reference box. 'view-box' was specified but is not supported for HTML elements. The used value should be 'border-box' for the polygon() function instead. By mixing percentage and absolute values as coordinates we check the correct used reference box. On sucess you should see a green vertical stripe next to a lime green vertical stripe. Both should be of equal size.
clip-path-polygon-013 reference/clip-path-stripes-003-ref CSS Masking: Test clip-path and polygon different units http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path 3371a1258a8d2ddbbf18dd93ea937a86c3d06f6f `Dirk Schulze`<mailto:dschulze@adobe.com> Test the support of different units for polygon coordinates. The test passes if you see a multiple green and blue stripe pairs. For each pair, the blue and green stripe must be of same length.
clip-rect-auto-001 reference/clip-overflow-hidden-ref CSS Masking: Test clip property with rect function and auto values clip to border box - 1 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 0845a592f963c525c4169d8b66eb69d7ae8db937 `Dirk Schulze`<mailto:dschulze@adobe.com> A value of 'auto' in the rect function is equal to the certain edge of the border box. The content should be clipped to the border box. On pass you see a blue square and a smaller green square in the bottom right corner of the blue square.
clip-rect-auto-002 reference/clip-no-clipping-ref CSS Masking: Test clip property with rect function and auto values clip to border box - 2 http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property eb938b4e7c5f4edb9bbb50eacc26a21f829be761 `Dirk Schulze`<mailto:dschulze@adobe.com> A value of 'auto' in the rect function is equal to the certain edge of the border box. The box shadow should be clipped, since it is painted outside the border box. On pass you should see a green square with a blue border.
clip-rect-auto-003 reference/clip-rect-top-ref CSS Masking: Test clip property with rect function and auto value for top value http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 0ba846e7e0e584887b770c790a2016d7e40278cf `Dirk Schulze`<mailto:dschulze@adobe.com> A value of 'auto' for 'top' in the rect function is equal to the top edge of the border box. The box shadow should be clipped, since it is painted outside the border box. On pass you should see a horizontal green stripe under a horizontal blue stripe.
clip-rect-auto-004 reference/clip-rect-right-ref CSS Masking: Test clip property with rect function and auto value for right value http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 6dfa81d38d978cb65068eeb81cf71fbc4196ba58 `Dirk Schulze`<mailto:dschulze@adobe.com> A value of 'auto' for 'right' in the rect function is equal to the top edge of the border box. The box shadow should be clipped, since it is painted outside the border box. On pass you should see a vertical blue stripe on the right side of a vertical green stripe.
clip-rect-auto-005 reference/clip-rect-bottom-ref CSS Masking: Test clip property with rect function and auto value for bottom value http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property f29b3392463a2840769e61470829ce662c322ce1 `Dirk Schulze`<mailto:dschulze@adobe.com> A value of 'auto' for 'bottom' in the rect function is equal to the top edge of the border box. The box shadow should be clipped, since it is painted outside the border box. On pass you should see a horizontal blue stripe under a horizontal green stripe.
clip-rect-auto-006 reference/clip-rect-left-ref CSS Masking: Test clip property with rect function and auto value for left value http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#clip-property 25fbea228b18a140d1bf55975d17dbc9a5162468 `Dirk Schulze`<mailto:dschulze@adobe.com> A value of 'auto' for 'left' in the rect function is equal to the top edge of the border box. The box shadow should be clipped, since it is painted outside the border box. On pass you should see a vertical green stripe on the right side of a vertical blue stripe.
clip-rect-comma-001 reference/clip-absolute-positioned-ref CSS Masking: Test comma separation of rect function on clip - no commas http://www.w3.org/TR/css-masking-1/#clip-property 26f2f7ab6c17b15238c81a3c15e80a5b7d045c39 `Dirk Schulze`<mailto:dschulze@adobe.com> Values for rect function on clip can be white space or comma separated, but not both. Otherwise the property setting gets ignored. Testing rect function with white space separation. On pass you should see a green square and no red.
clip-rect-comma-002 reference/clip-no-clipping-ref CSS Masking: Test comma separation of rect function on clip - no comma between 1st and 2nd value http://www.w3.org/TR/css-masking-1/#clip-property bb2798d9908b1650562b5549ea0f510483a60fd8 `Dirk Schulze`<mailto:dschulze@adobe.com> Values for rect function on clip can be white space or comma separated, but not both. Otherwise the property setting gets ignored. Testing rect function without comma separation between 1st and 2nd value. On pass you should see a green square with a blue border.
clip-rect-comma-003 reference/clip-no-clipping-ref CSS Masking: Test comma separation of rect function on clip - no comma between 2nd and 3rd value http://www.w3.org/TR/css-masking-1/#clip-property bb6037be9d575eeadccf5960a6334f6c82fb1a72 `Dirk Schulze`<mailto:dschulze@adobe.com> Values for rect function on clip can be white space or comma separated, but not both. Otherwise the property setting gets ignored. Testing rect function without comma separation between 2nd and 3rd value. On pass you should see a green square with a blue border.
clip-rect-comma-004 reference/clip-no-clipping-ref CSS Masking: Test comma separation of rect function on clip - no comma between 3rd and 4th value http://www.w3.org/TR/css-masking-1/#clip-property 38b542cefdad3a69bbb2c9161784112bfdbb0565 `Dirk Schulze`<mailto:dschulze@adobe.com> Values for rect function on clip can be white space or comma separated, but not both. Otherwise the property setting gets ignored. Testing rect function without comma separation between 3rd and 4th value. On pass you should see a green square with a blue border.
clip-rule-001 reference/clip-rule-rectangle-border-ref CSS Masking: Test clip-rule property on polygon clip rule evenodd http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path,http://www.w3.org/TR/css-masking-1/#ClipPathElement 685b1c6b98405699db11621e3739893d03bb287f `Dirk Schulze`<mailto:dschulze@adobe.com> The clipPath element takes the basic shape 'polygon' for clipping. The point list for the polygon creates a 'whole' with the dimension of the background. With the clip rule 'evenodd', this whole is clipped out. The clipping makes the green background of the parent div box visible. On pass you should see a green box with a blue border.
clip-rule-002 reference/clip-rule-rectangle-border-ref CSS Masking: Test clip-rule property on polygon clip rule nonzero http://www.w3.org/TR/css-masking-1/#clipping-paths,http://www.w3.org/TR/css-masking-1/#propdef-clip-path,http://www.w3.org/TR/css-masking-1/#ClipPathElement 060477805299dce5079f7940f4140876d0d2d33e `Dirk Schulze`<mailto:dschulze@adobe.com> The clipPath element takes the basic shape 'polygon' for clipping. The point list for the polygon creates a 'whole' with the dimension of the background. With the clip rule 'nonzero', this whole is clipped out. The clipping makes the green background of the parent div box visible. On pass you should see a green box with a blue border.
test-mask reference/test-mask-ref CSS Masking: mask-repeat:round repeat; http://www.w3.org/TR/css-masking-1/#the-mask-repeat d958a4c5495e1038da67e6f0a88ada4dbb3f9c1d `Li Jun`<mailto:64835173@qq.com> Test checks that the mask-repeart value
|
