[ResourceList] Make item actions accessible

UNRELEASED.md

@@ -48,10 +48,12 @@ Use [the changelog guidelines](https://git.io/polaris-changelog-guidelines) to f
 - Updated translation.yml with the new locales path ([#1649](https://github.com/Shopify/polaris-react/pull/1649))
 - Fixed accessibility issue with `Tabs` list item presentation role ([#1958](https://github.com/Shopify/polaris-react/pull/1958))
 - Removed `Tooltip` on disabled `Pagination` buttons ([#1963](https://github.com/Shopify/polaris-react/pull/1963))
+- Fixed accessibility labels on `ResourceList.Item` persistent action disclosure icon ([#1973](https://github.com/Shopify/polaris-react/pull/1973))
 
 ### Documentation
 
 - Updated `AppProvider` app bridge example to use our `AppBridgeContext`([#1877](https://github.com/Shopify/polaris-react/pull/1877))
+- Updated example for the `ResourceList.Item` persistent actions accessibility labels ([#1973](https://github.com/Shopify/polaris-react/pull/1973))
 
 ### Development workflow
 

a11y_shitlist.json

@@ -77,24 +77,6 @@
       "selector": "#Popover1 > div > div > ul > li:nth-child(5) > div > button"
     }
   ],
-  "all-components-resource-list--resource-list-with-persistent-item-shortcut-actions": [
-    {
-      "code": "WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.Button.Name",
-      "context": "<button type=\"button\" class=\"Button-Button_2pL_i Button-plain_RU0pa Button-iconOnly_2ZPSS\" tabindex=\"0\" aria-controls=\"Popover1\" aria-owns=\"Popover1\" aria-haspopup=\"true\" aria-expanded=\"false\"><span class=\"Button-Content_2iX...</button>",
-      "message": "This button element does not have a name available to an accessibility API. Valid names are: title undefined, element content, aria-label undefined, aria-labelledby undefined.",
-      "type": "error",
-      "typeCode": 1,
-      "selector": "#341 > div:nth-child(4) > div > button"
-    },
-    {
-      "code": "WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.Button.Name",
-      "context": "<button type=\"button\" class=\"Button-Button_2pL_i Button-plain_RU0pa Button-iconOnly_2ZPSS\" tabindex=\"0\" aria-controls=\"Popover2\" aria-owns=\"Popover2\" aria-haspopup=\"true\" aria-expanded=\"false\"><span class=\"Button-Content_2iX...</button>",
-      "message": "This button element does not have a name available to an accessibility API. Valid names are: title undefined, element content, aria-label undefined, aria-labelledby undefined.",
-      "type": "error",
-      "typeCode": 1,
-      "selector": "#256 > div:nth-child(4) > div > button"
-    }
-  ],
   "all-components-resource-list--resource-list-with-filtering": [
     {
       "code": "WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.A.NoContent",
@@ -112,23 +94,5 @@
       "typeCode": 1,
       "selector": "#ResourceListItemOverlay2"
     }
-  ],
-  "all-components-resource-list--resource-list-with-all-of-its-elements": [
-    {
-      "code": "WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.Button.Name",
-      "context": "<button type=\"button\" class=\"Button-Button_2pL_i Button-plain_RU0pa Button-iconOnly_2ZPSS\" tabindex=\"0\" aria-controls=\"Popover2\" aria-owns=\"Popover2\" aria-haspopup=\"true\" aria-expanded=\"false\"><span class=\"Button-Content_2iX...</button>",
-      "message": "This button element does not have a name available to an accessibility API. Valid names are: title undefined, element content, aria-label undefined, aria-labelledby undefined.",
-      "type": "error",
-      "typeCode": 1,
-      "selector": "#341 > div:nth-child(4) > div > button"
-    },
-    {
-      "code": "WCAG2AA.Principle4.Guideline4_1.4_1_2.H91.Button.Name",
-      "context": "<button type=\"button\" class=\"Button-Button_2pL_i Button-plain_RU0pa Button-iconOnly_2ZPSS\" tabindex=\"0\" aria-controls=\"Popover3\" aria-owns=\"Popover3\" aria-haspopup=\"true\" aria-expanded=\"false\"><span class=\"Button-Content_2iX...</button>",
-      "message": "This button element does not have a name available to an accessibility API. Valid names are: title undefined, element content, aria-label undefined, aria-labelledby undefined.",
-      "type": "error",
-      "typeCode": 1,
-      "selector": "#256 > div:nth-child(4) > div > button"
-    }
   ]
 }

src/components/ResourceList/README.md

@@ -614,7 +614,13 @@ Shortcut actions are intended to provide quick access to popular actions from th
       const {id, url, name, location, latestOrderUrl} = item;
       const media = <Avatar customer size="medium" name={name} />;
       const shortcutActions = latestOrderUrl
-        ? [{content: 'View latest order', url: latestOrderUrl}]
+        ? [
+            {
+              content: 'View latest order',
+              accessibilityLabel: `View ${name}'s latest order`,
+              url: latestOrderUrl,
+            },
+          ]
         : null;
 
       return (
@@ -664,7 +670,13 @@ Use persistent shortcut actions in rare cases when the action cannot be made ava
       const {id, url, name, location, latestOrderUrl} = item;
       const media = <Avatar customer size="medium" name={name} />;
       const shortcutActions = latestOrderUrl
-        ? [{content: 'View latest order', url: latestOrderUrl}]
+        ? [
+            {
+              content: 'View latest order',
+              accessibilityLabel: `View ${name}'s latest order`,
+              url: latestOrderUrl,
+            },
+          ]
         : null;
 
       return (

src/components/ResourceList/components/Item/Item.tsx

@@ -217,7 +217,7 @@ export class BaseItem extends React.Component<CombinedProps, State> {
             <Popover
               activator={
                 <Button
-                  aria-label={intl.translate(
+                  accessibilityLabel={intl.translate(
                     'Polaris.ResourceList.Item.actionsDropdown',
                   )}
                   onClick={this.handleActionsClick}