ColorPicker accessibility - fixed button label not read by screen reader

[kmmkwong]

Fixes #

• the accessibility issue by adding the missing assistive text to be read by screen reader for the toggle button in ColorPicker

Additional description

• the assistive text is missing. We are using a node as label so we need to provide some assistive text for screen reader in the node also.

---

CONTRIBUTOR checklist (do not remove)

Please complete for every pull request

• First-time contributors should sign the Contributor License Agreement. It's a fancy way of saying that you are giving away your contribution to this project. If you haven't before, wait a few minutes and a bot will comment on this pull request with instructions.
• npm run lint:fix has been run and linting passes.
• [x ] Mocha, Jest (Storyshots), and components/component-docs.json CI tests pass (npm test).
• Tests have been added for new props to prevent regressions in the future. See readme.
• Review the appropriate Storybook stories. Open http://localhost:9001/.
• Review tests are passing in the browser. Open http://localhost:8001/.
• Review markup conforms to SLDS by looking at DOM snapshot strings.

REVIEWER checklist (do not remove)

• CircleCI tests pass. This includes linting, Mocha, Jest, Storyshots, and components/component-docs.json tests.
• Tests have been added for new props to prevent regressions in the future. See readme.
• Review the appropriate Storybook stories. Open http://localhost:9001/.
• The Accessibility panel of each Storybook story has 0 violations (aXe). Open http://localhost:9001/.
• Review tests are passing in the browser. Open http://localhost:8001/.
• Review markup conforms to SLDS by looking at DOM snapshot strings.

Required only if there are markup / UX changes

• Add year-first date and commit SHA to last-slds-markup-review in package.json and push.
• Request a review of the deployed Heroku app by the Salesforce UX Accessibility Team.
• Add year-first review date, and commit SHA, last-accessibility-review, to package.json and push.
• While the contributor's branch is checked out, run npm run local-update within locally cloned site repo to confirm the site will function correctly at the next release.

[salesforce-cla]

Thanks for the contribution! It looks like @kmmkwong is an internal user so signing the CLA is not required. However, we need to confirm this.

[kmmkwong]

@garygong @kevinparkerson @interactivellama please kindly review.

[kmmkwong]

This mirrors the way assistive text is being added by Button component. But we need to add it manually here since the label is a node instead of a string.

[kmmkwong]

@kevinparkerson thanks for approving. Much appreciated! Would you also know how to remove the cla:missing tag? I signed the confirmation form already but it's not being picked up.

[interactivellama]

Great find! on this Button label @kmmkwong

[kmmkwong]

@kevinparkerson Mind reapproving this? I needed to close and re-open the PR to trigger the cla:missing removal.

[interactivellama]

@kmmkwong This is released.