From 58ff20c06a94229bfc5200c1f988a511f418fe2c Mon Sep 17 00:00:00 2001
From: Anirudh Mani <anirudh.mani@okta.com>
Date: Thu, 22 Aug 2024 15:33:27 -0700
Subject: [PATCH] test: add test using selector for readOnly

---
 .../odyssey-mui/Checkbox/Checkbox.stories.tsx       | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/packages/odyssey-storybook/src/components/odyssey-mui/Checkbox/Checkbox.stories.tsx b/packages/odyssey-storybook/src/components/odyssey-mui/Checkbox/Checkbox.stories.tsx
index 9b9dfb094c..1c59281ddc 100644
--- a/packages/odyssey-storybook/src/components/odyssey-mui/Checkbox/Checkbox.stories.tsx
+++ b/packages/odyssey-storybook/src/components/odyssey-mui/Checkbox/Checkbox.stories.tsx
@@ -18,7 +18,7 @@ import {
 import { Meta, StoryObj } from "@storybook/react";
 import { userEvent, within } from "@storybook/testing-library";
 import { expect } from "@storybook/jest";
-// import { queryOdysseySelector } from "@okta/odyssey-react-mui/test-selectors";
+import { queryOdysseySelector } from "@okta/odyssey-react-mui/test-selectors";
 
 import { fieldComponentPropsMetaData } from "../../../fieldComponentPropsMetaData";
 import { MuiThemeDecorator } from "../../../../.storybook/components";
@@ -268,6 +268,17 @@ export const ReadOnly: StoryObj<typeof Checkbox> = {
   },
   play: async ({ canvasElement, step }) => {
     await checkTheBox({ canvasElement, step })("ReadOnly Checkbox");
+    await step("has aria read only set", async () => {
+      const element = queryOdysseySelector({
+        canvas: within(canvasElement),
+        componentName: "Checkbox",
+        templateArgs: {
+          label: "Automatically assign Okta Admin Console",
+        },
+      }).element;
+
+      expect(element?.ariaReadOnly).toBeTruthy();
+    });
   },
 };