fix(aom): consolidating the aria dom property names (#192)

salesforce · Mar 30, 2018 · 13cd8c4 · 13cd8c4
1 parent 7672429
commit 13cd8c4
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 17 deletions.
diff --git a/packages/lwc-engine/src/framework/__tests__/def.spec.ts b/packages/lwc-engine/src/framework/__tests__/def.spec.ts
@@ -79,15 +79,13 @@ describe('def', () => {
                 accessKey: null,
                 ariaActiveDescendant: null,
                 ariaAtomic: null,
-                ariaAutocomplete: null,
+                ariaAutoComplete: null,
                 ariaBusy: null,
                 ariaChecked: null,
                 ariaControls: null,
                 ariaCurrent: null,
                 ariaDescribedBy: null,
                 ariaDisabled: null,
-                ariaDragged: null,
-                ariaDropEffect: null,
                 ariaExpanded: null,
                 ariaFlowTo: null,
                 ariaHasPopUp: null,
@@ -98,12 +96,12 @@ describe('def', () => {
                 ariaLevel: null,
                 ariaLive: null,
                 ariaMultiSelectable: null,
-                ariaMultiline: null,
+                ariaMultiLine: null,
                 ariaOrientation: null,
                 ariaOwns: null,
                 ariaPosInSet: null,
                 ariaPressed: null,
-                ariaReadonly: null,
+                ariaReadOnly: null,
                 ariaRelevant: null,
                 ariaRequired: null,
                 ariaSelected: null,
@@ -113,6 +111,17 @@ describe('def', () => {
                 ariaValueMin: null,
                 ariaValueNow: null,
                 ariaValueText: null,
+                ariaColCount: null,
+                ariaColIndex: null,
+                ariaDetails: null,
+                ariaErrorMessage: null,
+                ariaKeyShortcuts: null,
+                ariaModal: null,
+                ariaPlaceholder: null,
+                ariaRoleDescription: null,
+                ariaRowCount: null,
+                ariaRowIndex: null,
+                ariaRowSpan: null,
                 dir: null,
                 draggable: null,
                 hidden: null,
@@ -124,7 +133,7 @@ describe('def', () => {
             });
         });
 
-        it('should provide default html props', () => {
+        it('should provide definition for each individual html prop', () => {
             function foo() {}
             class MyComponent extends Element  {}
             const { props } = target.getComponentDef(MyComponent);
@@ -140,7 +149,7 @@ describe('def', () => {
                 attr: 'role',
             });
             // aria exception
-            expect(props.ariaAutocomplete).toEqual({
+            expect(props.ariaAutoComplete).toEqual({
                 config: 3,
                 type: 'any',
                 attr: 'aria-autocomplete',

diff --git a/packages/lwc-engine/src/framework/dom.ts b/packages/lwc-engine/src/framework/dom.ts
@@ -134,7 +134,7 @@ export function attemptAriaAttributeFallback(vm: VM, attrName: string) {
 // respective default value.
 // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques
 export const GlobalAOMProperties: Record<string, any> = {
-    ariaAutocomplete: null,
+    ariaAutoComplete: null,
     ariaChecked: null,
     ariaCurrent: null,
     ariaDisabled: null,
@@ -144,11 +144,11 @@ export const GlobalAOMProperties: Record<string, any> = {
     ariaInvalid: null,
     ariaLabel: null,
     ariaLevel: null,
-    ariaMultiline: null,
+    ariaMultiLine: null,
     ariaMultiSelectable: null,
     ariaOrientation: null,
     ariaPressed: null,
-    ariaReadonly: null,
+    ariaReadOnly: null,
     ariaRequired: null,
     ariaSelected: null,
     ariaSort: null,
@@ -160,8 +160,6 @@ export const GlobalAOMProperties: Record<string, any> = {
     ariaRelevant: null,
     ariaAtomic: null,
     ariaBusy: null,
-    ariaDropEffect: null,
-    ariaDragged: null,
     ariaActiveDescendant: null,
     ariaControls: null,
     ariaDescribedBy: null,
@@ -170,6 +168,17 @@ export const GlobalAOMProperties: Record<string, any> = {
     ariaOwns: null,
     ariaPosInSet: null,
     ariaSetSize: null,
+    ariaColCount: null,
+    ariaColIndex: null,
+    ariaDetails: null,
+    ariaErrorMessage: null,
+    ariaKeyShortcuts: null,
+    ariaModal: null,
+    ariaPlaceholder: null,
+    ariaRoleDescription: null,
+    ariaRowCount: null,
+    ariaRowIndex: null,
+    ariaRowSpan: null,
     role: null,
 };
 

diff --git a/packages/lwc-template-compiler/src/parser/constants.ts b/packages/lwc-template-compiler/src/parser/constants.ts
@@ -70,7 +70,7 @@ export const ATTRS_PROPS_TRANFORMS: { [name: string]: string } = {
     'for': 'htmlFor',
 
     // Aria
-    'aria-autocomplete': 'ariaAutocomplete',
+    'aria-autocomplete': 'ariaAutoComplete',
     'aria-checked': 'ariaChecked',
     'aria-current': 'ariaCurrent',
     'aria-disabled': 'ariaDisabled',
@@ -80,11 +80,11 @@ export const ATTRS_PROPS_TRANFORMS: { [name: string]: string } = {
     'aria-invalid': 'ariaInvalid',
     'aria-label': 'ariaLabel',
     'aria-level': 'ariaLevel',
-    'aria-multiline': 'ariaMultiline',
+    'aria-multiline': 'ariaMultiLine',
     'aria-multiselectable': 'ariaMultiSelectable',
     'aria-orientation': 'ariaOrientation',
     'aria-pressed': 'ariaPressed',
-    'aria-readonly': 'ariaReadonly',
+    'aria-readonly': 'ariaReadOnly',
     'aria-required': 'ariaRequired',
     'aria-selected': 'ariaSelected',
     'aria-sort': 'ariaSort',
@@ -96,8 +96,6 @@ export const ATTRS_PROPS_TRANFORMS: { [name: string]: string } = {
     'aria-relevant': 'ariaRelevant',
     'aria-atomic': 'ariaAtomic',
     'aria-busy': 'ariaBusy',
-    'aria-dropeffect': 'ariaDropEffect',
-    'aria-dragged': 'ariaDragged',
     'aria-activedescendant': 'ariaActiveDescendant',
     'aria-controls': 'ariaControls',
     'aria-describedby': 'ariaDescribedBy',
@@ -106,6 +104,18 @@ export const ATTRS_PROPS_TRANFORMS: { [name: string]: string } = {
     'aria-owns': 'ariaOwns',
     'aria-posinset': 'ariaPosInSet',
     'aria-setsize': 'ariaSetSize',
+
+    'aria-colcount': 'ariaColCount',
+    'aria-colindex': 'ariaColIndex',
+    'aria-details': 'ariaDetails',
+    'aria-errormessage': 'ariaErrorMessage',
+    'aria-keyshortcuts': 'ariaKeyShortcuts',
+    'aria-modal': 'ariaModal',
+    'aria-placeholder': 'ariaPlaceholder',
+    'aria-roledescription': 'ariaRoleDescription',
+    'aria-rowcount': 'ariaRowCount',
+    'aria-rowindex': 'ariaRowIndex',
+    'aria-rowspan': 'ariaRowSpan',
 };
 
 export const HTML_TAG_BLACKLIST: { [tagname: string]: boolean } = {