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

Scrollable element is keyboard accessible: test cases break if user changes browser default font #1389

Closed
dd8 opened this issue Jul 12, 2020 · 6 comments

Comments

@dd8
Copy link
Collaborator

dd8 commented Jul 12, 2020

Some of the test cases only work when the user hasn't changed the browser default font family or font size

Making the font smaller makes some of the failed examples pass (because the content is too small to scroll), making the font bigger makes some passed examples fail.

I think you need a style rule on the section element to set line-height, font-size and font-family (and possibly other properties that affect text rendering).

@dd8
Copy link
Collaborator Author

dd8 commented Jul 13, 2020

Even when fonts are explicitly specified in CSS, there are cases where the fonts used cause failures on Windows, but not Mac (or vice versa). If you apply this style to https://act-rules.github.io/rules/0ssw9k#inapplicable-example-5

font-family: AppleGothic, Verdana;

It doesn't have hidden scrolling text on macOS but does on Windows because Verdana characters are much wider than AppleGothic characters. If neither font is available then it falls back to the browser default font (which is user controlled).

@Jym77
Copy link
Collaborator

Jym77 commented Jul 22, 2020

But, can't user style override any styling?
In which case almost any rule that use CSS can have that overriden and has all its examples broken…

@carlosapaduarte
Copy link
Member

I don't think @dd8 was addressing user stylesheets, but just changing the default font family and size in the browser settings. To be honest, I haven't checked in all browsers, but I think that does not override inline styles.

@dd8
Copy link
Collaborator Author

dd8 commented Jul 23, 2020

Yes, it's the browser settings - not user stylesheets:

In Chrome you can change default font size in the Appearance section of the settings page (chrome://settings/)

In Safari on macOS it's even easier to change - just hold down the Option key when zooming:
https://support.apple.com/en-gb/HT207209

In Firefox it's on the Preferences page:
https://support.mozilla.org/en-US/kb/font-size-and-zoom-increase-size-of-web-pages#w_set-a-default-zoom-level-for-all-websites

@dd8
Copy link
Collaborator Author

dd8 commented Jul 23, 2020

The default font size is implemented as the CSS initial value for the font-size: property. Any author CSS stylesheets or style attributes that specify font-size: override the browser default font size unless they specify font-size: initial.

Edit: the default font size also affects rem units and em units on the root element

@WilcoFiers
Copy link
Member

We discussed this on the TF last time around. The decision there is that browser default are something content authors should be able to rely on. If the user does something to the font-size that causes issues, that is not something the content author is responsible for. Implementors need to make sure they are running a browser with default settings for testing, since not doing so can cause false positives. Carlos has this issue to resolve this #1445.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants