diff --git a/polaris-react/src/components/ThemeProvider/tests/ThemeProvider.test.tsx b/polaris-react/src/components/ThemeProvider/tests/ThemeProvider.test.tsx
new file mode 100644
index 00000000000..a9024d8db65
--- /dev/null
+++ b/polaris-react/src/components/ThemeProvider/tests/ThemeProvider.test.tsx
@@ -0,0 +1,71 @@
+import React from 'react';
+import {mountWithApp} from 'tests/utilities';
+import {themeNameDefault} from '@shopify/polaris-tokens';
+import type {ThemeName} from '@shopify/polaris-tokens';
+
+import {ThemeProvider} from '../ThemeProvider';
+import {useThemeName} from '../../../utilities/use-theme';
+
+const LIGHT_THEME: ThemeName = 'light';
+const DARK_THEME: ThemeName = 'dark-experimental';
+
+describe('', () => {
+ const ThemeNameText = () => {
+ const themeName = useThemeName();
+
+ return {themeName};
+ };
+
+ it('uses default theme when no component level ThemeProviders', () => {
+ const app = mountWithApp();
+ expect(app).toContainReactText(themeNameDefault);
+ });
+
+ it('uses light theme when wrapped in a light theme provider', () => {
+ const app = mountWithApp(
+
+
+ ,
+ );
+ expect(app).toContainReactText(LIGHT_THEME);
+ });
+
+ it('uses dark theme when wrapped in a dark theme provider', () => {
+ const app = mountWithApp(
+
+
+ ,
+ );
+ expect(app).toContainReactText(DARK_THEME);
+ });
+
+ it('nests a dark theme within a light theme', () => {
+ const app = mountWithApp(
+
+
+
+
+
+ ,
+ );
+
+ const themes = app.findAll(ThemeNameText);
+ expect(themes[0]).toContainReactText(LIGHT_THEME);
+ expect(themes[1]).toContainReactText(DARK_THEME);
+ });
+
+ it('nests a light theme within a dark theme', () => {
+ const app = mountWithApp(
+
+
+
+
+
+ ,
+ );
+
+ const themes = app.findAll(ThemeNameText);
+ expect(themes[0]).toContainReactText(DARK_THEME);
+ expect(themes[1]).toContainReactText(LIGHT_THEME);
+ });
+});