From 2e17f864009668f548563dfb99beec7ed46b7a65 Mon Sep 17 00:00:00 2001
From: ZeeshanTamboli <zeeshan.tamboli@gmail.com>
Date: Sat, 22 Jun 2024 19:06:26 +0530
Subject: [PATCH 1/4] fix inherit color is inconsistent between ThemeProvider
 and CSSVarsProvider

---
 packages/mui-material/src/AppBar/AppBar.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/mui-material/src/AppBar/AppBar.js b/packages/mui-material/src/AppBar/AppBar.js
index fec36c2e635a3d..06855da11e9652 100644
--- a/packages/mui-material/src/AppBar/AppBar.js
+++ b/packages/mui-material/src/AppBar/AppBar.js
@@ -126,7 +126,9 @@ const AppBarRoot = styled(Paper, {
                 theme.vars.palette[ownerState.color].contrastText,
               ),
         }),
-      backgroundColor: 'var(--AppBar-background)',
+      ...(!['inherit', 'transparent'].includes(ownerState.color) && {
+        backgroundColor: 'var(--AppBar-background)',
+      }),
       color: ownerState.color === 'inherit' ? 'inherit' : 'var(--AppBar-color)',
       ...(ownerState.color === 'transparent' && {
         backgroundImage: 'none',

From d3805acfa721de8f62511bf029adb16bff493504 Mon Sep 17 00:00:00 2001
From: ZeeshanTamboli <zeeshan.tamboli@gmail.com>
Date: Sat, 22 Jun 2024 22:45:22 +0530
Subject: [PATCH 2/4] add test

---
 .../mui-material/src/AppBar/AppBar.test.js    | 40 +++++++++++++++++++
 1 file changed, 40 insertions(+)

diff --git a/packages/mui-material/src/AppBar/AppBar.test.js b/packages/mui-material/src/AppBar/AppBar.test.js
index 2f21d3626e6ae8..75d17edd64569a 100644
--- a/packages/mui-material/src/AppBar/AppBar.test.js
+++ b/packages/mui-material/src/AppBar/AppBar.test.js
@@ -3,6 +3,8 @@ import { expect } from 'chai';
 import { createRenderer, screen } from '@mui-internal/test-utils';
 import AppBar, { appBarClasses as classes } from '@mui/material/AppBar';
 import Paper from '@mui/material/Paper';
+import { ThemeProvider, CssVarsProvider, hexToRgb } from '@mui/material/styles';
+import defaultTheme from '../styles/defaultTheme';
 import describeConformance from '../../test/describeConformance';
 
 describe('<AppBar />', () => {
@@ -62,4 +64,42 @@ describe('<AppBar />', () => {
       expect(appBar).to.have.class('mui-fixed');
     });
   });
+
+  it('should inherit Paper background color with ThemeProvider', function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      this.skip();
+    }
+
+    render(
+      <ThemeProvider theme={defaultTheme}>
+        <AppBar data-testid="root" color="inherit">
+          Hello World
+        </AppBar>
+      </ThemeProvider>,
+    );
+
+    const appBar = screen.getByTestId('root');
+    expect(appBar).toHaveComputedStyle({
+      backgroundColor: hexToRgb(defaultTheme.palette.background.paper),
+    });
+  });
+
+  it('should inherit Paper background color with CssVarsProvider', function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      this.skip();
+    }
+
+    render(
+      <CssVarsProvider>
+        <AppBar data-testid="root" color="inherit">
+          Hello World
+        </AppBar>
+      </CssVarsProvider>,
+    );
+
+    const appBar = screen.getByTestId('root');
+    expect(appBar).toHaveComputedStyle({
+      backgroundColor: hexToRgb(defaultTheme.palette.background.paper),
+    });
+  });
 });

From 0c238e55cb4fa2df3f7b3c7c0d58df4f59329863 Mon Sep 17 00:00:00 2001
From: ZeeshanTamboli <zeeshan.tamboli@gmail.com>
Date: Sat, 22 Jun 2024 22:58:01 +0530
Subject: [PATCH 3/4] use Experimental prefix

---
 packages/mui-material/src/AppBar/AppBar.test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/mui-material/src/AppBar/AppBar.test.js b/packages/mui-material/src/AppBar/AppBar.test.js
index 75d17edd64569a..317a4943e80e9d 100644
--- a/packages/mui-material/src/AppBar/AppBar.test.js
+++ b/packages/mui-material/src/AppBar/AppBar.test.js
@@ -3,7 +3,7 @@ import { expect } from 'chai';
 import { createRenderer, screen } from '@mui-internal/test-utils';
 import AppBar, { appBarClasses as classes } from '@mui/material/AppBar';
 import Paper from '@mui/material/Paper';
-import { ThemeProvider, CssVarsProvider, hexToRgb } from '@mui/material/styles';
+import { ThemeProvider, Experimental_CssVarsProvider as CssVarsProvider, hexToRgb } from '@mui/material/styles';
 import defaultTheme from '../styles/defaultTheme';
 import describeConformance from '../../test/describeConformance';
 

From 6e338faa02460b79be9cb1bf50f62c0fcf5cef73 Mon Sep 17 00:00:00 2001
From: ZeeshanTamboli <zeeshan.tamboli@gmail.com>
Date: Sat, 22 Jun 2024 22:58:18 +0530
Subject: [PATCH 4/4] prettier

---
 packages/mui-material/src/AppBar/AppBar.test.js | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/mui-material/src/AppBar/AppBar.test.js b/packages/mui-material/src/AppBar/AppBar.test.js
index 317a4943e80e9d..a990d3a894c2fd 100644
--- a/packages/mui-material/src/AppBar/AppBar.test.js
+++ b/packages/mui-material/src/AppBar/AppBar.test.js
@@ -3,7 +3,11 @@ import { expect } from 'chai';
 import { createRenderer, screen } from '@mui-internal/test-utils';
 import AppBar, { appBarClasses as classes } from '@mui/material/AppBar';
 import Paper from '@mui/material/Paper';
-import { ThemeProvider, Experimental_CssVarsProvider as CssVarsProvider, hexToRgb } from '@mui/material/styles';
+import {
+  ThemeProvider,
+  Experimental_CssVarsProvider as CssVarsProvider,
+  hexToRgb,
+} from '@mui/material/styles';
 import defaultTheme from '../styles/defaultTheme';
 import describeConformance from '../../test/describeConformance';