Config file
AMA comes with predefined rules and severity for the built-in components and hooks. Those rules have been created to improve the accessibility of those elements and should always be respected.
Customizing log levels can be done via the ama.config.json
file to handle edge cases that are out of our control, and require breaking a rule or two.
The library does not perform any accessibility checks on the production build!
The log levels
AMA guidelines are categorised as:
- and : Those best practices are enforced and AMA overlays an error when fail
- and : Those best practices are preferred and AMA prints only prints a warning message when fail
The possible log levels are:
- error: The AMA error overlay when a check fails
- warn: A
console.warn
is performed when a check fails
AMA Rules
Log key | Guideline | Default | Can override |
---|---|---|---|
BOTTOM_SHEET_CLOSE_ACTION | error | ||
CONTRAST_FAILED | error | ||
CONTRAST_FAILED_AAA | warn | ||
FLATLIST_NO_COUNT_IN_SINGULAR_MESSAGE | warn | ||
FLATLIST_NO_COUNT_IN_PLURAL_MESSAGE | error | ||
MINIMUM_SIZE | error | ||
NO_ACCESSIBILITY_LABEL1 | error | ||
NO_ACCESSIBILITY_ROLE 1 | error | ||
NO_FORM_LABEL | error | ||
NO_FORM_ERROR | error | ||
NO_KEYBOARD_TRAP 1 | error | ||
UPPERCASE_TEXT_NO_ACCESSIBILITY_LABEL | error | ||
NO_UPPERCASE_TEXT | error |
Rules marked with
are considered bad practices and cannot be turned off!Constants
Elements that perform a contrast check do it on all the children up to the level specified by CONTRAST_CHECKER_MAX_DEPTH
.
Constant key | Default value |
---|---|
CONTRAST_CHECKER_MAX_DEPTH | 5 |
{
"CONTRAST_CHECKER_MAX_DEPTH": 0
}
This can be turned off by specifying a level of 0
accessibilityLabelExceptions
AMA performs various checks, including one for uppercase. This rule allows specifying a list of approved all-caps accessibility labels.
{
"accessibilityLabelExceptions": ["FAQ"]
}
Customising the log levels
Create a JSON file called ama.config.json
in the project's root folder to customise the log rules, then specify the custom log level for the wanted key.
Example
The JSON file does not need to contain all log keys. AMA uses the default rule if a key is not present:
{
"CONTRAST_FAILED": "warn",
"CONTRAST_CHECKER_MAX_DEPTH": 0,
"accessibilityLabelExceptions": ["FAQ"]
}
Whenever the ama.rules.json
file is updated, update the copy within the node_modules
folder and restart the development server.
cp ama.rules.json node_modules/react-native-ama/
yarn start