diff --git a/packages/preset-rules/src/custom-rules/checks.ts b/packages/preset-rules/src/custom-rules/checks.ts index 453906c8..caa8df54 100644 --- a/packages/preset-rules/src/custom-rules/checks.ts +++ b/packages/preset-rules/src/custom-rules/checks.ts @@ -21,7 +21,7 @@ const checkData = [ { id: 'Resize-reflow-textoverflow-check', evaluate: - "function (node) {const style = window.getComputedStyle(node); const tabIndex = node.getAttribute('tabindex'); if (tabIndex === '-1' && node.actualNode && !isVisibleOnScreen(node) && !isVisibleToScreenReaders(node)) { return false; } if (node.innerText === '') { return false; } if (style.getPropertyValue('text-overflow') === 'ellipsis') { function isTextTruncated(element) {const isTruncated = (element.scrollWidth > element.clientWidth); return isTruncated; } return !isTextTruncated(node); } return true; }", + "function (node) {const style = window.getComputedStyle(node); const tabIndex = node.getAttribute('tabindex'); if (tabIndex === '-1' && node.actualNode && !isVisibleOnScreen(node) && !isVisibleToScreenReaders(node)) { return false; } if (!node.innerText ===\"\") { return false; } if (style.getPropertyValue('text-overflow') === 'ellipsis') { function isTextTruncated(element) {const isTruncated = (element.scrollWidth > element.clientWidth); return isTruncated; } return !isTextTruncated(node); } if (style.getPropertyValue('display') === '-webkit-box' && style.getPropertyValue('-webkit-line-clamp') != 0 && style.getPropertyValue('overflow') === 'hidden' && style.getPropertyValue('-webkit-box-orient') === 'vertical') { function isTextTruncated(element) { const isTruncated = (element.scrollWidth>element.clientWidth); return isTruncated; } return !isTextTruncated(node); } return true; }", metadata: { impact: 'moderate', messages: { diff --git a/packages/preset-rules/src/custom-rules/rules.ts b/packages/preset-rules/src/custom-rules/rules.ts index fb1c6d5a..758f45ff 100644 --- a/packages/preset-rules/src/custom-rules/rules.ts +++ b/packages/preset-rules/src/custom-rules/rules.ts @@ -22,11 +22,17 @@ const rulesData = [ }, { id: 'Resize-reflow-textoverflow', - selector: '*', // Target all elements + selector: '*', enabled: true, any: ['Resize-reflow-textoverflow-check'], all: [], - tags: ['custom'], + metadata: { + description: 'Ensure Ellipses are not present as text is truncated.', + help: 'Text elements do not have ellipsis as text is truncated.', + helpUrl: 'https://example.com/custom-rule-help', + impact: 'moderate', + tags: ['wcag1410', 'custom'], + }, }, ];