From 7a4d776ef643f0d3f8a92226b2c96818aa31b496 Mon Sep 17 00:00:00 2001
From: mferrarini <maura_ferrarini@harvard.edu>
Date: Thu, 3 Aug 2023 14:38:35 -0400
Subject: [PATCH 1/2] add aria-labels to differentiate buttons

---
 src/MiradorShareDialog.js | 2 +-
 src/MiradorShareEmbed.js  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/MiradorShareDialog.js b/src/MiradorShareDialog.js
index 57e11a0..0394ace 100644
--- a/src/MiradorShareDialog.js
+++ b/src/MiradorShareDialog.js
@@ -149,7 +149,7 @@ export class MiradorShareDialog extends Component {
                 />
                 {' '}
                 <CopyToClipboard text={shareLinkText}>
-                  <Button className={classes.copyButton} variant="outlined" color="primary">Copy</Button>
+                  <Button className={classes.copyButton} variant="outlined" color="primary" aria-label="Copy link">Copy</Button>
                 </CopyToClipboard>
               </div>
               <Divider />
diff --git a/src/MiradorShareEmbed.js b/src/MiradorShareEmbed.js
index 8bd1f7c..ff21d71 100644
--- a/src/MiradorShareEmbed.js
+++ b/src/MiradorShareEmbed.js
@@ -161,7 +161,7 @@ class MiradorShareEmbed extends Component {
               variant="filled"
             />
             <CopyToClipboard text={this.embedCode()}>
-              <Button className={classes.copyButton} variant="outlined" color="primary">Copy</Button>
+              <Button className={classes.copyButton} variant="outlined" color="primary" aria-label="Copy code">Copy</Button>
             </CopyToClipboard>
           </div>
         </FormControl>

From d228e21ebcb11ef1e7487bad96717187e179f35b Mon Sep 17 00:00:00 2001
From: mferrarini <maura_ferrarini@harvard.edu>
Date: Thu, 3 Aug 2023 15:19:35 -0400
Subject: [PATCH 2/2] Add descriptive label to textarea formfield via label
 element; update tests

---
 __tests__/MiradorShareEmbed.test.js | 7 ++++---
 src/MiradorShareEmbed.js            | 8 +++++++-
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/__tests__/MiradorShareEmbed.test.js b/__tests__/MiradorShareEmbed.test.js
index 1018179..5dea496 100644
--- a/__tests__/MiradorShareEmbed.test.js
+++ b/__tests__/MiradorShareEmbed.test.js
@@ -18,17 +18,18 @@ function createWrapper(props) {
 describe('MiradorShareEmbed', () => {
   let wrapper;
 
-  it('renders fieldsets w/ legends for each section of the embed component', () => {
+  it('renders fieldsets w/ legends or labels for each section of the embed component', () => {
     wrapper = createWrapper();
 
     expect(wrapper.find('WithStyles(ForwardRef(FormControl))[component="fieldset"]').length).toBe(2);
-    expect(wrapper.find('WithStyles(ForwardRef(FormLabel))[component="legend"]').length).toBe(2);
+    expect(wrapper.find('WithStyles(ForwardRef(FormLabel))').length).toBe(2);
+    expect(wrapper.find('WithStyles(ForwardRef(FormLabel))[component="legend"]').length).toBe(1);
     expect(wrapper.find(
       'WithStyles(ForwardRef(FormLabel))',
     ).at(0).props().children).toEqual('Select viewer size');
     expect(wrapper.find(
       'WithStyles(ForwardRef(FormLabel))',
-    ).at(1).props().children).toEqual('then copy & paste code');
+    ).at(1).props().children).toEqual('Copy & paste code');
   });
 
   it('renders a radio group w/ a form control for each of the size options', () => {
diff --git a/src/MiradorShareEmbed.js b/src/MiradorShareEmbed.js
index ff21d71..683b599 100644
--- a/src/MiradorShareEmbed.js
+++ b/src/MiradorShareEmbed.js
@@ -151,9 +151,10 @@ class MiradorShareEmbed extends Component {
           </RadioGroup>
         </FormControl>
         <FormControl component="fieldset" className={classes.formControl}>
-          <FormLabel component="legend" className={classes.legend}>then copy &amp; paste code</FormLabel>
+          <FormLabel className={classes.label} for="copyCode">Copy &amp; paste code</FormLabel>
           <div className={classes.inputContainer}>
             <TextField
+              id="copyCode"
               fullWidth
               multiline
               rows={4}
@@ -176,6 +177,7 @@ MiradorShareEmbed.propTypes = {
     formControl: PropTypes.string,
     formControlLabel: PropTypes.string,
     legend: PropTypes.string,
+    label: PropTypes.string,
     inputContainer: PropTypes.string,
     radioGroup: PropTypes.string,
     selectedFormControlLabel: PropTypes.string,
@@ -221,6 +223,10 @@ const styles = theme => ({
     paddingBottom: theme.spacing(),
     paddingTop: theme.spacing(),
   },
+  label: {
+    paddingBottom: theme.spacing(),
+    paddingTop: theme.spacing(),
+  },
   inputContainer: {
     alignItems: 'flex-end',
     display: 'flex',