Test that clip-path shapes accept different length units

On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".


PASS innerStyle("-webkit-mask", "none") is "none"
PASS innerStyle("-webkit-mask", "none, none") is "none, none"
PASS innerStyle("-webkit-mask", "none, none, none") is "none, none, none"
PASS innerStyle("-webkit-mask", "url(file:///image.png), none") is "url(\"file:///image.png\"), none"
PASS innerStyle("-webkit-mask", "none, url(file:///image.png)") is "none, url(\"file:///image.png\")"
PASS innerStyle("-webkit-mask", "top left") is "left top"
PASS innerStyle("-webkit-mask", "bottom right") is "right bottom"
PASS innerStyle("-webkit-mask", "left bottom") is "left bottom"
PASS innerStyle("-webkit-mask", "right top") is "right top"
PASS innerStyle("-webkit-mask", "center") is "center center"
PASS innerStyle("-webkit-mask", "none top") is "none center top"
PASS innerStyle("-webkit-mask", "none bottom") is "none center bottom"
PASS innerStyle("-webkit-mask", "none right") is "none right center"
PASS innerStyle("-webkit-mask", "none top right") is "none right top"
PASS innerStyle("-webkit-mask", "none bottom left") is "none left bottom"
PASS innerStyle("-webkit-mask", "none right") is "none right center"
PASS innerStyle("-webkit-mask", "none left") is "none left center"
PASS innerStyle("-webkit-mask", "center 50%") is "center 50%"
PASS innerStyle("-webkit-mask", "50px 50%") is "50px 50%"
PASS innerStyle("-webkit-mask", "center left") is "left center"
PASS innerStyle("-webkit-mask", "top center") is "center top"
PASS innerStyle("-webkit-mask", "left 10px top 15px") is "left 10px top 15px"
PASS innerStyle("-webkit-mask", "left 10% top 30%") is "left 10% top 30%"
PASS innerStyle("-webkit-mask", "right top 15px") is "right top 15px"
PASS innerStyle("-webkit-mask", "left 10px center") is "left 10px center"
PASS innerStyle("-webkit-mask", "center top 20px") is "center top 20px"
PASS innerStyle("-webkit-mask", "center left 30px") is "left 30px center"
PASS innerStyle("-webkit-mask", "left 20% top") is "left 20% top"
PASS innerStyle("-webkit-mask", "center center") is "center center"
PASS innerStyle("-webkit-mask-position", "left 10px top 15px") is "left 10px top 15px"
PASS innerStyle("-webkit-mask-position", "left 10% top 30%") is "left 10% top 30%"
PASS innerStyle("-webkit-mask-position", "right top 15px") is "right top 15px"
PASS innerStyle("-webkit-mask-position", "left 10px center") is "left 10px center"
PASS innerStyle("-webkit-mask-position", "center top 20px") is "center top 20px"
PASS innerStyle("-webkit-mask-position", "center left 30px") is "left 30px center"
PASS innerStyle("-webkit-mask-position", "left 20% top") is "left 20% top"
PASS innerStyle("-webkit-mask", "none alpha") is "none alpha"
PASS innerStyle("-webkit-mask", "none luminance, none alpha") is "none luminance, none alpha"
PASS innerStyle("-webkit-mask", "none auto, none, none luminance") is "none auto, none, none luminance"
PASS innerStyle("-webkit-mask-source-type", "alpha") is "alpha"
PASS innerStyle("-webkit-mask-source-type", "luminance") is "luminance"
PASS innerStyle("-webkit-mask-source-type", "auto") is "auto"
PASS computedStyle("-webkit-mask-source-type", "alpha") is "alpha"
PASS computedStyle("-webkit-mask-source-type", "auto") is "alpha"
PASS computedStyle("-webkit-mask-source-type", "luminance") is "luminance"
PASS computedStyle("-webkit-mask-source-type", "") is "alpha"
PASS innerStyle("-webkit-mask", "repeat-x") is "repeat-x"
PASS innerStyle("-webkit-mask", "repeat-y") is "repeat-y"
PASS innerStyle("-webkit-mask", "repeat") is "repeat"
PASS innerStyle("-webkit-mask", "space") is "space"
PASS innerStyle("-webkit-mask", "no-repeat") is "no-repeat"
PASS innerStyle("-webkit-mask", "repeat space") is "repeat space"
PASS innerStyle("-webkit-mask", "repeat round") is "repeat round"
PASS innerStyle("-webkit-mask", "repeat no-repeat") is "repeat no-repeat"
PASS innerStyle("-webkit-mask", "repeat space, repeat-x") is "repeat space, repeat-x"
PASS innerStyle("-webkit-mask", "repeat none") is "none repeat"
PASS innerStyle("-webkit-mask", "none repeat") is "none repeat"
PASS innerStyle("-webkit-mask", "padding-box") is "padding-box padding-box"
PASS innerStyle("-webkit-mask", "border-box") is "border-box border-box"
PASS innerStyle("-webkit-mask", "content-box") is "content-box content-box"
PASS innerStyle("-webkit-mask", "padding-box none") is "none padding-box padding-box"
PASS innerStyle("-webkit-mask", "none padding-box") is "none padding-box padding-box"
PASS innerStyle("-webkit-mask", "padding-box content-box") is "padding-box content-box"
PASS innerStyle("-webkit-mask", "content-box content-box") is "content-box content-box"
PASS innerStyle("-webkit-mask", "padding-box border-box") is "padding-box border-box"
PASS innerStyle("-webkit-mask", "padding-box border-box none") is "none padding-box border-box"
PASS innerStyle("-webkit-mask", "none padding-box border-box") is "none padding-box border-box"
PASS innerStyle("-webkit-mask", "none left top / auto") is "none left top / auto"
PASS innerStyle("-webkit-mask", "none left top / auto auto") is "none left top / auto"
PASS innerStyle("-webkit-mask", "none left top / 100%") is "none left top / 100%"
PASS innerStyle("-webkit-mask", "none left top / 100% 100%") is "none left top / 100% 100%"
PASS innerStyle("-webkit-mask", "none left top / 0%") is "none left top / 0%"
PASS innerStyle("-webkit-mask", "none left top / auto 0%") is "none left top / auto 0%"
PASS innerStyle("-webkit-mask", "none left top / cover") is "none left top / cover"
PASS innerStyle("-webkit-mask", "none left top / contain") is "none left top / contain"
PASS innerStyle("-webkit-mask", "none left 20px top 10px / contain") is "none left 20px top 10px / contain"
PASS innerStyle("-webkit-mask", "none left 20px top / contain") is "none left 20px top / contain"
PASS innerStyle("-webkit-mask", "none padding-box content-box") is "none padding-box content-box"
PASS innerStyle("-webkit-mask", "none padding-box") is "none padding-box padding-box"
PASS innerStyle("-webkit-mask", "none top") is "none center top"
PASS innerStyle("-webkit-mask", "none center right 20px") is "none right 20px center"
PASS innerStyle("-webkit-mask", "none border-box left top") is "none left top border-box border-box"
PASS innerStyle("-webkit-mask", "none border-box left top 20px") is "none left top 20px border-box border-box"
PASS innerStyle("-webkit-mask", "none border-box content-box left top repeat-x") is "none left top repeat-x border-box content-box"
PASS innerStyle("-webkit-mask", "none border-box content-box left top / auto repeat-x") is "none left top / auto repeat-x border-box content-box"
PASS innerStyle("-webkit-mask", "none border-box content-box right 0px center / auto repeat-x") is "none right 0px center / auto repeat-x border-box content-box"
PASS innerStyle("-webkit-mask", "top none left") is ""
PASS innerStyle("-webkit-mask", "right none bottom") is ""
PASS innerStyle("-webkit-mask", "right right") is ""
PASS innerStyle("-webkit-mask", "left left") is ""
PASS innerStyle("-webkit-mask", "top top") is ""
PASS innerStyle("-webkit-mask", "bottom bottom") is ""
PASS innerStyle("-webkit-mask", "50% none 50%") is ""
PASS innerStyle("-webkit-mask", "repeat-x repeat-x") is ""
PASS innerStyle("-webkit-mask", "space repeat-y") is ""
PASS innerStyle("-webkit-mask", "repeat space space") is ""
PASS innerStyle("-webkit-mask", "padding-box border-box content-box") is ""
PASS innerStyle("-webkit-mask", "none / auto") is ""
PASS innerStyle("-webkit-mask", "none repeat-x / auto") is ""
PASS innerStyle("-webkit-mask", "none border-box / auto") is ""
PASS innerStyle("-webkit-mask", "none top left / cover 100%") is ""
PASS innerStyle("-webkit-mask", "scroll") is ""
PASS innerStyle("-webkit-mask", "fixed") is ""
PASS innerStyle("-webkit-mask", "local") is ""
PASS innerStyle("-webkit-mask", "space scroll") is ""
PASS innerStyle("-webkit-mask", "none scroll") is ""
PASS innerStyle("-webkit-mask", "none top left / auto repeat-x scroll border-box border-box") is ""
PASS innerStyle("-webkit-mask", "right top left") is ""
PASS innerStyle("-webkit-mask", "center left center") is ""
PASS innerStyle("-webkit-mask", "center top center") is ""
PASS innerStyle("-webkit-mask", "center right bottom") is ""
PASS innerStyle("-webkit-mask", "top solid bottom") is ""
PASS innerStyle("-webkit-mask", "none top left right center top / auto repeat-x scroll border-box border-box") is ""
PASS innerStyle("-webkit-mask", "none center center 20px / auto repeat-x scroll border-box border-box") is ""
PASS innerStyle("-webkit-mask", "none top 20px right 30px center / auto repeat-x scroll border-box border-box") is ""
PASS innerStyle("-webkit-mask", "none top 20px top 30px / auto repeat-x scroll border-box border-box") is ""
PASS innerStyle("-webkit-mask", "none top 20px bottom / auto repeat-x scroll border-box border-box") is ""
PASS innerStyle("-webkit-mask", "none alpha, none auto alpha") is ""
PASS innerStyle("-webkit-mask", "none alpha luminance") is ""
PASS innerStyle("-webkit-mask-source-type", "rubbish") is ""
PASS innerStyle("-webkit-mask-source-type", "") is ""
PASS innerStyle("-webkit-mask-source-type", "center") is ""
PASS innerStyle("-webkit-mask-source-type", "repeat") is ""
PASS successfullyParsed is true

TEST COMPLETE