ref(test): Convert resource subscription to rtl (#41117)

Convert test to RTL and Typescript

static/app/views/settings/organizationDeveloperSettings/resourceSubscriptions.spec.jsx

@@ -1,106 +0,0 @@
-import {mountWithTheme} from 'sentry-test/enzyme';
-
-import Form from 'sentry/components/forms/form';
-import Subscriptions from 'sentry/views/settings/organizationDeveloperSettings/resourceSubscriptions';
-
-describe('Resource Subscriptions', () => {
-  let wrapper;
-  let onChange;
-
-  describe('initial no-access permissions', () => {
-    beforeEach(() => {
-      onChange = jest.fn();
-      wrapper = mountWithTheme(
-        <Form>
-          <Subscriptions
-            events={[]}
-            permissions={{
-              Event: 'no-access',
-              Team: 'no-access',
-              Project: 'write',
-              Release: 'admin',
-              Organization: 'admin',
-            }}
-            onChange={onChange}
-          />
-        </Form>
-      );
-    });
-
-    it('renders disabled checkbox with no issue permission', () => {
-      expect(
-        wrapper.find('SubscriptionBox').first().prop('disabledFromPermissions')
-      ).toBe(true);
-    });
-
-    it('updates events state when new permissions props is passed', () => {
-      const permissions = {
-        Event: 'read',
-        Team: 'no-access',
-        Project: 'write',
-        Release: 'admin',
-        Organization: 'admin',
-      };
-      wrapper = mountWithTheme(
-        <Form>
-          <Subscriptions events={[]} permissions={permissions} onChange={onChange} />
-        </Form>
-      );
-
-      expect(
-        wrapper.find('SubscriptionBox').first().prop('disabledFromPermissions')
-      ).toBe(false);
-    });
-  });
-
-  describe('initial access to permissions', () => {
-    beforeEach(() => {
-      onChange = jest.fn();
-      wrapper = mountWithTheme(
-        <Form>
-          <Subscriptions
-            events={['issue']}
-            permissions={{
-              Event: 'read',
-              Team: 'no-access',
-              Project: 'write',
-              Release: 'admin',
-              Organization: 'admin',
-            }}
-            onChange={onChange}
-          />
-        </Form>
-      );
-    });
-
-    it('renders nondisabled checkbox with correct permissions', () => {
-      expect(
-        wrapper.find('SubscriptionBox').first().prop('disabledFromPermissions')
-      ).toBe(false);
-    });
-
-    it('revoked permissions also revokes access to corresponding subscriptions', () => {
-      const permissions = {
-        Event: 'no-access',
-        Team: 'no-access',
-        Project: 'write',
-        Release: 'admin',
-        Organization: 'admin',
-      };
-      wrapper = mountWithTheme(
-        <Form>
-          <Subscriptions
-            events={['issue']}
-            permissions={permissions}
-            onChange={onChange}
-          />
-        </Form>
-      );
-
-      wrapper.setProps({permissions});
-      expect(
-        wrapper.find('SubscriptionBox').first().prop('disabledFromPermissions')
-      ).toBe(true);
-    });
-  });
-});

static/app/views/settings/organizationDeveloperSettings/resourceSubscriptions.spec.tsx

@@ -0,0 +1,103 @@
+import {render, screen} from 'sentry-test/reactTestingLibrary';
+
+import Form from 'sentry/components/forms/form';
+import Subscriptions from 'sentry/views/settings/organizationDeveloperSettings/resourceSubscriptions';
+
+describe('Resource Subscriptions', function () {
+  describe('initial no-access permissions', function () {
+    it('renders disabled checkbox with no issue permission', function () {
+      render(
+        <Form>
+          <Subscriptions
+            events={[]}
+            permissions={{
+              Event: 'no-access',
+              Team: 'no-access',
+              Project: 'write',
+              Release: 'admin',
+              Organization: 'admin',
+              Member: 'admin',
+            }}
+            onChange={jest.fn()}
+          />
+        </Form>
+      );
+
+      expect(screen.getAllByRole('checkbox')).toHaveLength(3);
+      expect(screen.getByRole('checkbox', {name: 'issue'})).toBeDisabled();
+      expect(screen.getByRole('checkbox', {name: 'error'})).toBeDisabled();
+      expect(screen.getByRole('checkbox', {name: 'comment'})).toBeDisabled();
+    });
+
+    it('updates events state when new permissions props is passed', function () {
+      render(
+        <Form>
+          <Subscriptions
+            events={[]}
+            permissions={{
+              Event: 'read',
+              Team: 'no-access',
+              Project: 'write',
+              Release: 'admin',
+              Organization: 'admin',
+              Member: 'admin',
+            }}
+            onChange={jest.fn()}
+          />
+        </Form>
+      );
+
+      expect(screen.getByRole('checkbox', {name: 'issue'})).toBeEnabled();
+      expect(screen.getByRole('checkbox', {name: 'error'})).toBeDisabled();
+      expect(screen.getByRole('checkbox', {name: 'comment'})).toBeEnabled();
+    });
+  });
+
+  describe('initial access to permissions', function () {
+    it('renders nondisabled checkbox with correct permissions', function () {
+      render(
+        <Form>
+          <Subscriptions
+            events={['issue']}
+            permissions={{
+              Event: 'read',
+              Team: 'no-access',
+              Project: 'write',
+              Release: 'admin',
+              Organization: 'admin',
+              Member: 'admin',
+            }}
+            onChange={jest.fn()}
+          />
+        </Form>
+      );
+
+      expect(screen.getByRole('checkbox', {name: 'issue'})).toBeEnabled();
+      expect(screen.getByRole('checkbox', {name: 'error'})).toBeDisabled();
+      expect(screen.getByRole('checkbox', {name: 'comment'})).toBeEnabled();
+    });
+
+    it('revoked permissions also revokes access to corresponding subscriptions', function () {
+      render(
+        <Form>
+          <Subscriptions
+            events={['issue']}
+            permissions={{
+              Event: 'no-access',
+              Team: 'no-access',
+              Project: 'write',
+              Release: 'admin',
+              Organization: 'admin',
+              Member: 'admin',
+            }}
+            onChange={jest.fn()}
+          />
+        </Form>
+      );
+
+      expect(screen.getByRole('checkbox', {name: 'issue'})).toBeDisabled();
+      expect(screen.getByRole('checkbox', {name: 'error'})).toBeDisabled();
+      expect(screen.getByRole('checkbox', {name: 'comment'})).toBeDisabled();
+    });
+  });
+});

static/app/views/settings/organizationDeveloperSettings/subscriptionBox.tsx

@@ -65,6 +65,7 @@ function SubscriptionBox({
         </SubscriptionInfo>
         <Checkbox
           key={`${resource}${checked}`}
+          aria-label={resource}
           disabled={disabled}
           id={resource}
           value={resource}