ref(tests): Convert project Plugin to rtl and typescript (#40254)

static/app/views/settings/projectPlugins/projectPlugins.spec.jsx

@@ -1,51 +0,0 @@
-import {mountWithTheme} from 'sentry-test/enzyme';
-
-import ProjectPlugins from 'sentry/views/settings/projectPlugins/projectPlugins';
-
-describe('ProjectPlugins', function () {
-  let wrapper;
-  const plugins = TestStubs.Plugins();
-  const org = TestStubs.Organization();
-  const project = TestStubs.Project();
-  const params = {
-    orgId: org.slug,
-    projectId: project.slug,
-  };
-
-  it('renders', function () {
-    wrapper = mountWithTheme(<ProjectPlugins params={params} plugins={plugins} />);
-
-    expect(wrapper).toSnapshot();
-  });
-
-  it('has loading state', function () {
-    wrapper = mountWithTheme(<ProjectPlugins params={params} loading plugins={[]} />);
-
-    expect(wrapper.find('LoadingIndicator')).toHaveLength(1);
-  });
-
-  it('has error state when plugins=null and loading is true', function () {
-    wrapper = mountWithTheme(
-      <ProjectPlugins
-        params={params}
-        plugins={null}
-        loading
-        error={new Error('An error')}
-      />
-    );
-
-    expect(wrapper.find('RouteError')).toHaveLength(1);
-  });
-
-  it('has error state when plugins=[]', function () {
-    wrapper = mountWithTheme(
-      <ProjectPlugins
-        params={params}
-        plugins={[]}
-        loading
-        error={new Error('An error')}
-      />
-    );
-    expect(wrapper.find('RouteError')).toHaveLength(1);
-  });
-});

static/app/views/settings/projectPlugins/projectPlugins.spec.tsx

@@ -0,0 +1,58 @@
+import {initializeOrg} from 'sentry-test/initializeOrg';
+import {render, screen, waitFor} from 'sentry-test/reactTestingLibrary';
+
+import ProjectPlugins from 'sentry/views/settings/projectPlugins/projectPlugins';
+
+describe('ProjectPlugins', function () {
+  it('renders', async function () {
+    const {organization, route, router, project} = initializeOrg();
+
+    const {container} = render(
+      <ProjectPlugins
+        params={{
+          orgId: organization.slug,
+        }}
+        project={project}
+        onChange={jest.fn()}
+        loading={false}
+        error={undefined}
+        plugins={TestStubs.Plugins()}
+        router={router}
+        routes={router.routes}
+        route={route}
+        location={router.location}
+        routeParams={router.params}
+      />
+    );
+
+    await waitFor(() =>
+      expect(screen.queryByTestId('loading-indicator')).not.toBeInTheDocument()
+    );
+
+    expect(container).toSnapshot();
+  });
+
+  it('has error state when plugins=[]', async function () {
+    const {organization, route, router, project} = initializeOrg();
+
+    render(
+      <ProjectPlugins
+        params={{
+          orgId: organization.slug,
+        }}
+        project={project}
+        onChange={jest.fn()}
+        loading={false}
+        error={new Error('An error')}
+        plugins={[]}
+        router={router}
+        routes={router.routes}
+        route={route}
+        location={router.location}
+        routeParams={router.params}
+      />
+    );
+
+    expect(await screen.findByText('Oops! Something went wrong')).toBeInTheDocument();
+  });
+});