Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rehabilitated and improved border-image-slice-00[5|7] tests #25825

Merged
merged 1 commit into from Sep 30, 2020

Conversation

TalbotG
Copy link
Contributor

@TalbotG TalbotG commented Sep 29, 2020

This is a followup to
#23808

css/css-backgrounds/border-image-slice-005.htm
css/css-backgrounds/border-image-slice-007.htm
css/css-backgrounds/reference/border-image-slice-005-ref.html
css/css-backgrounds/reference/border-image-slice-007-ref.html
css/css-backgrounds/support/9grid40-30-20-10-green.png
css/css-backgrounds/support/9grid40-30-20-10-red.png

Over in PR23808, these were @fantasai's most relevant+important review comments:

{
(...) We need an image that doesn't only detect when the UA slices too much, but also if it slices off too little.

My suggestion here is to use a skewed "striped border": design the image so that once it is sliced and squished into the border, it creates an evenly striped border. Since the numbers here are all divisible by a factor of 5, then 5 even stripes on each side would work well. The image will be uneven from side to side, but once it is squished into the border it will be even all the way around.

If there are stripes missing in the test, then we know the UA sliced too little of the image. If there is red in the test, then it sliced too much. It has to slice exactly the right amount.
}

On my website, the tests and references are:

http://www.gtalbot.org/BrowserBugsSection/CSS3Backgrounds/border-image-slice-005-newest2-GT.html

http://www.gtalbot.org/BrowserBugsSection/CSS3Backgrounds/reference/border-image-slice-005-newer-GT-ref.html

http://www.gtalbot.org/BrowserBugsSection/CSS3Backgrounds/border-image-slice-007-newest2-GT.html

http://www.gtalbot.org/BrowserBugsSection/CSS3Backgrounds/reference/border-image-slice-007-newer-GT-ref.html

I must add that it seems to me impossible to avoid some fuzzy anti-aliased pixels around the leftmost vertical blue stripes when zooming/magnifying to, say, 200% the webpages of tests. Without zooming/magnifying, I believe that a normal human can not, will not see fuzziness around the leftmost vertical blue stripes.

@TalbotG TalbotG merged commit 11a6ab8 into web-platform-tests:master Sep 30, 2020
@TalbotG TalbotG deleted the CSS3Backgrounds-GT-PR25 branch September 30, 2020 16:13
ziransun pushed a commit to ziransun/wpt that referenced this pull request Oct 6, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants