deps(ui): Upgrade react testing library dependencies (#72137)

Author: scttcper

package.json

@@ -180,9 +180,10 @@
     "@sentry/jest-environment": "6.0.0",
     "@sentry/profiling-node": "^8.0.0",
     "@styled/typescript-styled-plugin": "^1.0.1",
+    "@testing-library/dom": "10.1.0",
     "@testing-library/jest-dom": "6.4.5",
-    "@testing-library/react": "^14.2.1",
-    "@testing-library/user-event": "^14.5.2",
+    "@testing-library/react": "16.0.0",
+    "@testing-library/user-event": "14.5.2",
     "@types/node": "^20.11.7",
     "babel-gettext-extractor": "^4.1.3",
     "babel-jest": "29.7.0",

static/app/components/sidebar/index.spec.tsx

@@ -256,7 +256,7 @@ describe('Sidebar', function () {
       const {unmount} = renderSidebar({organization});
 
       // This will start timer to mark as seen
-      await userEvent.click(await screen.findByRole('link', {name: "What's new"}), {
+      await userEvent.click(await screen.findByTestId('sidebar-broadcasts'), {
         delay: null,
       });
       expect(await screen.findByText("What's new in Sentry")).toBeInTheDocument();

static/app/components/sidebar/sidebarDropdown/switchOrganization.spec.tsx

@@ -21,13 +21,13 @@ describe('SwitchOrganization', function () {
     expect(screen.getByRole('list')).toBeInTheDocument();
 
     expect(screen.getByText('Organization 1')).toBeInTheDocument();
-    expect(screen.getByRole('link', {name: 'org slug Organization 1'})).toHaveAttribute(
+    expect(screen.getByRole('link', {name: 'OS Organization 1'})).toHaveAttribute(
       'href',
       '/organizations/org-slug/issues/'
     );
 
     expect(screen.getByText('Organization 2')).toBeInTheDocument();
-    expect(screen.getByRole('link', {name: 'org2 Organization 2'})).toHaveAttribute(
+    expect(screen.getByRole('link', {name: 'O Organization 2'})).toHaveAttribute(
       'href',
       '/organizations/org2/issues/'
     );
@@ -57,11 +57,11 @@ describe('SwitchOrganization', function () {
 
     expect(screen.getByRole('list')).toBeInTheDocument();
 
-    const org1Link = screen.getByRole('link', {name: 'org1 Organization 1'});
+    const org1Link = screen.getByRole('link', {name: 'O Organization 1'});
     expect(org1Link).toBeInTheDocument();
     expect(org1Link).toHaveAttribute('href', '/organizations/org1/issues/');
 
-    const org2Link = screen.getByRole('link', {name: 'org2 Organization 2'});
+    const org2Link = screen.getByRole('link', {name: 'O Organization 2'});
     expect(org2Link).toBeInTheDocument();
     expect(org2Link).toHaveAttribute(
       'href',
@@ -92,11 +92,11 @@ describe('SwitchOrganization', function () {
 
     expect(screen.getByRole('list')).toBeInTheDocument();
 
-    const org1Link = screen.getByRole('link', {name: 'org1 Organization 1'});
+    const org1Link = screen.getByRole('link', {name: 'O Organization 1'});
     expect(org1Link).toBeInTheDocument();
     expect(org1Link).toHaveAttribute('href', '/organizations/org1/issues/');
 
-    const org2Link = screen.getByRole('link', {name: 'org2 Organization 2'});
+    const org2Link = screen.getByRole('link', {name: 'O Organization 2'});
     expect(org2Link).toBeInTheDocument();
     expect(org2Link).toHaveAttribute('href', '/organizations/org2/issues/');
     jest.useRealTimers();
@@ -128,7 +128,7 @@ describe('SwitchOrganization', function () {
 
     expect(screen.getByRole('list')).toBeInTheDocument();
 
-    const org1Link = screen.getByRole('link', {name: 'org1 Organization 1'});
+    const org1Link = screen.getByRole('link', {name: 'O Organization 1'});
     expect(org1Link).toBeInTheDocument();
     // Current hostname in the URL is expected to be org2.sentry.io, so we need to make use of sentryUrl to link to an
     // organization that does not support customer domains.
@@ -137,7 +137,7 @@ describe('SwitchOrganization', function () {
       'https://sentry.io/organizations/org1/issues/'
     );
 
-    const org2Link = screen.getByRole('link', {name: 'org2 Organization 2'});
+    const org2Link = screen.getByRole('link', {name: 'O Organization 2'});
     expect(org2Link).toBeInTheDocument();
     expect(org2Link).toHaveAttribute(
       'href',
@@ -180,11 +180,11 @@ describe('SwitchOrganization', function () {
 
     expect(screen.getByRole('list')).toBeInTheDocument();
 
-    const org1Link = screen.getByRole('link', {name: 'org1 Organization 1'});
+    const org1Link = screen.getByRole('link', {name: 'O Organization 1'});
     expect(org1Link).toBeInTheDocument();
     expect(org1Link).toHaveAttribute('href', '/organizations/org1/issues/');
 
-    const org3Link = screen.getByRole('link', {name: 'org3 Organization 3'});
+    const org3Link = screen.getByRole('link', {name: 'O Organization 3'});
     expect(org3Link).toBeInTheDocument();
     expect(org3Link).toHaveAttribute(
       'href',