diff --git a/static/app/components/checkboxFancy/checkboxFancy.tsx b/static/app/components/checkboxFancy/checkboxFancy.tsx
index 42de8b8dd6f231..3eb596d18fcc21 100644
--- a/static/app/components/checkboxFancy/checkboxFancy.tsx
+++ b/static/app/components/checkboxFancy/checkboxFancy.tsx
@@ -35,7 +35,7 @@ const CheckboxFancy = styled(
data-test-id="checkbox-fancy"
role="checkbox"
aria-disabled={isDisabled}
- aria-checked={isChecked}
+ aria-checked={isIndeterminate ? 'mixed' : isChecked}
className={className}
onClick={onClick}
>
diff --git a/tests/js/spec/components/checkboxFancy.spec.tsx b/tests/js/spec/components/checkboxFancy.spec.tsx
index e6c18174057a73..ba0a5052021053 100644
--- a/tests/js/spec/components/checkboxFancy.spec.tsx
+++ b/tests/js/spec/components/checkboxFancy.spec.tsx
@@ -1,31 +1,31 @@
-import {mountWithTheme} from 'sentry-test/enzyme';
+import {mountWithTheme} from 'sentry-test/reactTestingLibrary';
import CheckboxFancy from 'app/components/checkboxFancy/checkboxFancy';
describe('CheckboxFancy', function () {
it('renders', function () {
- const wrapper = mountWithTheme();
- expect(wrapper).toSnapshot();
+ const {container} = mountWithTheme();
+ expect(container).toSnapshot();
});
it('isChecked', function () {
const wrapper = mountWithTheme();
- expect(wrapper.props().isChecked).toEqual(true);
- expect(wrapper.find('[data-test-id="icon-check-mark"]').exists()).toEqual(true);
- expect(wrapper.find('[data-test-id="icon-subtract"]').exists()).toEqual(false);
+ expect(wrapper.getByRole('checkbox', {checked: true})).toBeTruthy();
+ expect(wrapper.getByTestId('icon-check-mark')).toBeInTheDocument();
+ expect(wrapper.queryByTestId('icon-subtract')).toBeNull();
});
it('isIndeterminate', function () {
const wrapper = mountWithTheme();
- expect(wrapper.props().isIndeterminate).toEqual(true);
- expect(wrapper.find('[data-test-id="icon-check-mark"]').exists()).toEqual(false);
- expect(wrapper.find('[data-test-id="icon-subtract"]').exists()).toEqual(true);
+ expect(wrapper.getByRole('checkbox')).toHaveAttribute('aria-checked', 'mixed');
+ expect(wrapper.queryByTestId('icon-check-mark')).toBeNull();
+ expect(wrapper.getByTestId('icon-subtract')).toBeInTheDocument();
});
it('isDisabled', function () {
const wrapper = mountWithTheme();
- expect(wrapper.props().isDisabled).toEqual(true);
- expect(wrapper.find('[data-test-id="icon-check-mark"]').exists()).toEqual(false);
- expect(wrapper.find('[data-test-id="icon-subtract"]').exists()).toEqual(false);
+ expect(wrapper.getByRole('checkbox')).toHaveAttribute('aria-disabled', 'true');
+ expect(wrapper.queryByTestId('icon-check-mark')).toBeNull();
+ expect(wrapper.queryByTestId('icon-subtract')).toBeNull();
});
});