💼 This rule is enabled in the 📋 template-lint-migration config.
In practice, the predominant issue raised by inline whitespace styling is that the resultant text "formatting" is entirely visual in nature; the ability to discern the correct manner in which to read the text, and therefore, to correctly comprehend its meaning, is restricted to sighted users.
Using in-line whitespace word formatting produces results that are explicitly mentioned in WCAG's list of common sources of web accessibility failures. Specifically, this common whitespace-within-word-induced web accessibility issue fails to successfully achieve WCAG Success Criterion 1.3.2: Meaningful Sequence.
The template-no-whitespace-within-word rule operates on the assumption that artificially-spaced English words in rendered text content contain, at a minimum, two word characters fencepost-delimited by three whitespace characters (space-char-space-char-space) so it should be avoided.
This rule forbids the following:
<template>
W e l c o m e
</template>W e l c o m e
Wel c o me
Wel c o me
<template>
<div>W e l c o m e</div>
<div>Wel c o me</div>
</template>This rule allows the following:
Welcome
Yes I am
It is possible to get some examples of in-word emph a sis past this rule.
However, I do not want a rule that flags annoying false positives for correctly-used single-character words.
<template>
<div>Welcome</div>
<div>Yes I am.</div>
</template>This rule uses the heuristic of letter, whitespace character, letter, whitespace character, letter which makes it a good candidate for most use cases, but not ideal for some languages (such as Japanese).
Use CSS to add letter-spacing to a word.