【React】Material-UIのボタンに設定した色が消えてしまう

Question

前提

React＋Material-UIでプロジェクトを作成中。

実現したいこと

エラー？をなくしたい。

発生している問題・エラーメッセージ

ビルドして本番環境でページを開いた際、Material-UIで作成したボタンの色が一瞬で消えてしまう（色を設定しているのに白になってしまう）
※Chromeのみ、Safari、FireFoxでは上記は起こらない。Chromeでもエラーを吐いているわけではない。

該当のソースコード

const theme = createTheme({
   palette: {
      gold: {
         main: "#c6ad23",
         contrastText: "#ffffff",
      },
   },
});

----------

<ThemeProvider theme={theme}>
   <div className="buttons">
      <Button
         variant="contained"
         color="gold"
         onClick={() => "CLICK_EVENT"}
      >
         Choose gold
      </Button>
   </div>
</ThemeProvider>

<Button
      variant="contained"
      onClick={() => setTexture(ooshima)}
>
      Button
</Button>

補足情報（FW/ツールのバージョンなど）

	"@emotion/react": "^11.10.4",
	"@emotion/styled": "^11.10.4",
	"@mui/material": "^5.10.3",
	"@testing-library/jest-dom": "^5.16.5",
	"@testing-library/react": "^13.3.0",
	"@testing-library/user-event": "^13.5.0",
	"react": "^18.2.0",
	"react-colorful": "^5.6.1",
	"react-dom": "^18.2.0",
	"react-scripts": "5.0.1",
	"styled-components": "^5.3.5",

ここにより詳細な情報を記載してください。

Answer 1

Chromeの拡張機能が干渉していました。

Answer 2

もうすでにPaletteOptionsを拡張しておりましたらすみません。

元々用意されているPaletteOptions外のカラーを設定する場合は、PaletteOptionsを拡張しないと対応しません。

declare module "@mui/material/styles" {
    interface PaletteOptions {
        gold?: PaletteColorOptions;
    }
    interface Palette {
        gold: PaletteColor;
    }
}

const theme = createTheme({
   palette: {
      gold: {
         main: "#c6ad23",
         contrastText: "#ffffff",
      },
   },
});

----------

<ThemeProvider theme={theme}>
   <div className="buttons">
      <Button
         variant="contained"
         color="gold"
         onClick={() => "CLICK_EVENT"}
      >
         Choose gold
      </Button>
   </div>
</ThemeProvider>

<Button
      variant="contained"
      onClick={() => setTexture(ooshima)}
>
      Button
</Button>

こちらで挙動はいかがでしょうか？

Comments

[teto_plw]

ご回答ありがとうございました。原因を切り分けたらどうやらPaletteOptionsではありませんでした。
もう少しシンプルにしたものを再質問させていただいたので、よかったらこちらも見ていただけるとありがたいです。
https://teratail.com/questions/e1chozjbhe4y9s