Make test ID compatible with findByTestId() of Cypress Testing Library (

#10617) 'data-test-id' is not discoverable with findByTestId() of Cypress Testing Library. Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
matrix-org · Apr 17, 2023 · 8a4a584 · 8a4a584
1 parent daad630
commit 8a4a584
Show file tree

Hide file tree

Showing 11 changed files with 15 additions and 15 deletions.
diff --git a/cypress/e2e/location/location.spec.ts b/cypress/e2e/location/location.spec.ts
@@ -23,7 +23,7 @@ describe("Location sharing", () => {
     let homeserver: HomeserverInstance;
 
     const selectLocationShareTypeOption = (shareType: string): Chainable<JQuery> => {
-        return cy.get(`[data-test-id="share-location-option-${shareType}"]`);
+        return cy.get(`[data-testid="share-location-option-${shareType}"]`);
     };
 
     const submitShareLocation = (): void => {

diff --git a/cypress/e2e/threads/threads.spec.ts b/cypress/e2e/threads/threads.spec.ts
@@ -392,7 +392,7 @@ describe("Threads", () => {
     it("should send location and reply to the location on ThreadView", () => {
         // See: location.spec.ts
         const selectLocationShareTypeOption = (shareType: string): Chainable<JQuery> => {
-            return cy.get(`[data-test-id="share-location-option-${shareType}"]`);
+            return cy.get(`[data-testid="share-location-option-${shareType}"]`);
         };
         const submitShareLocation = (): void => {
             cy.get('[data-testid="location-picker-submit-button"]').click();

diff --git a/src/components/views/beacon/LiveTimeRemaining.tsx b/src/components/views/beacon/LiveTimeRemaining.tsx
@@ -69,7 +69,7 @@ const LiveTimeRemaining: React.FC<{ beacon: Beacon }> = ({ beacon }) => {
     const liveTimeRemaining = _t(`%(timeRemaining)s left`, { timeRemaining });
 
     return (
-        <span data-test-id="room-live-share-expiry" className="mx_LiveTimeRemaining">
+        <span data-testid="room-live-share-expiry" className="mx_LiveTimeRemaining">
             {liveTimeRemaining}
         </span>
     );

diff --git a/src/components/views/beacon/OwnBeaconStatus.tsx b/src/components/views/beacon/OwnBeaconStatus.tsx
@@ -57,7 +57,7 @@ const OwnBeaconStatus: React.FC<Props & HTMLProps<HTMLDivElement>> = ({ beacon,
         >
             {ownDisplayStatus === BeaconDisplayStatus.Active && (
                 <AccessibleButton
-                    data-test-id="beacon-status-stop-beacon"
+                    data-testid="beacon-status-stop-beacon"
                     kind="link"
                     // eat events here to avoid 1) the map and 2) reply or thread tiles
                     // moving under the beacon status on stop/retry click
@@ -70,7 +70,7 @@ const OwnBeaconStatus: React.FC<Props & HTMLProps<HTMLDivElement>> = ({ beacon,
             )}
             {hasLocationPublishError && (
                 <AccessibleButton
-                    data-test-id="beacon-status-reset-wire-error"
+                    data-testid="beacon-status-reset-wire-error"
                     kind="link"
                     // eat events here to avoid 1) the map and 2) reply or thread tiles
                     // moving under the beacon status on stop/retry click
@@ -82,7 +82,7 @@ const OwnBeaconStatus: React.FC<Props & HTMLProps<HTMLDivElement>> = ({ beacon,
             )}
             {hasStopSharingError && (
                 <AccessibleButton
-                    data-test-id="beacon-status-stop-beacon-retry"
+                    data-testid="beacon-status-stop-beacon-retry"
                     kind="link"
                     // eat events here to avoid 1) the map and 2) reply or thread tiles
                     // moving under the beacon status on stop/retry click

diff --git a/src/components/views/dialogs/ExportDialog.tsx b/src/components/views/dialogs/ExportDialog.tsx
@@ -398,7 +398,7 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
                     )}
                 </div>
                 {isExporting ? (
-                    <div data-test-id="export-progress" className="mx_ExportDialog_progress">
+                    <div data-testid="export-progress" className="mx_ExportDialog_progress">
                         <Spinner w={24} h={24} />
                         <p>{exportProgressText}</p>
                         <DialogButtons

diff --git a/src/components/views/location/LiveDurationDropdown.tsx b/src/components/views/location/LiveDurationDropdown.tsx
@@ -71,7 +71,7 @@ const LiveDurationDropdown: React.FC<Props> = ({ timeout, onChange }) => {
         >
             {
                 options.map(({ key, label }) => (
-                    <div data-test-id={`live-duration-option-${key}`} key={key}>
+                    <div data-testid={`live-duration-option-${key}`} key={key}>
                         {label}
                     </div>
                 )) as NonEmptyArray<ReactElement & { key: string }>

diff --git a/src/components/views/location/ShareType.tsx b/src/components/views/location/ShareType.tsx
@@ -91,7 +91,7 @@ const ShareType: React.FC<Props> = ({ setShareType, enabledShareTypes }) => {
                         onClick={() => setShareType(type)}
                         label={labels[type]}
                         shareType={type}
-                        data-test-id={`share-location-option-${type}`}
+                        data-testid={`share-location-option-${type}`}
                     />
                 ))}
             </div>

diff --git a/src/components/views/right_panel/EncryptionInfo.tsx b/src/components/views/right_panel/EncryptionInfo.tsx
@@ -108,7 +108,7 @@ const EncryptionInfo: React.FC<IProps> = ({
 
     return (
         <React.Fragment>
-            <div data-test-id="encryption-info-description" className="mx_UserInfo_container">
+            <div data-testid="encryption-info-description" className="mx_UserInfo_container">
                 <h3>{_t("Encryption")}</h3>
                 {description}
             </div>

diff --git a/test/components/views/beacon/__snapshots__/BeaconViewDialog-test.tsx.snap b/test/components/views/beacon/__snapshots__/BeaconViewDialog-test.tsx.snap
@@ -65,14 +65,14 @@ exports[`<BeaconViewDialog /> renders own beacon status when user is live sharin
       </span>
       <span
         class="mx_LiveTimeRemaining"
-        data-test-id="room-live-share-expiry"
+        data-testid="room-live-share-expiry"
       >
         1h left
       </span>
     </div>
     <div
       class="mx_AccessibleButton mx_OwnBeaconStatus_button mx_OwnBeaconStatus_destructiveButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_link"
-      data-test-id="beacon-status-stop-beacon"
+      data-testid="beacon-status-stop-beacon"
       role="button"
       tabindex="0"
     >

diff --git a/test/components/views/beacon/__snapshots__/RoomLiveShareWarning-test.tsx.snap b/test/components/views/beacon/__snapshots__/RoomLiveShareWarning-test.tsx.snap
@@ -15,7 +15,7 @@ exports[`<RoomLiveShareWarning /> when user has live beacons and geolocation is
     </span>
     <span
       class="mx_LiveTimeRemaining"
-      data-test-id="room-live-share-expiry"
+      data-testid="room-live-share-expiry"
     >
       1h left
     </span>
@@ -46,7 +46,7 @@ exports[`<RoomLiveShareWarning /> when user has live beacons and geolocation is
     </span>
     <span
       class="mx_LiveTimeRemaining"
-      data-test-id="room-live-share-expiry"
+      data-testid="room-live-share-expiry"
     >
       12h left
     </span>

diff --git a/test/components/views/location/__snapshots__/LocationPicker-test.tsx.snap b/test/components/views/location/__snapshots__/LocationPicker-test.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`LocationPicker <LocationPicker /> for Live location share type updates selected duration 1`] = `
 <div
-  data-test-id="live-duration-option-3600000"
+  data-testid="live-duration-option-3600000"
 >
   Share for 1h
 </div>