diff --git a/src/material-experimental/mdc-theming/BUILD.bazel b/src/material-experimental/mdc-theming/BUILD.bazel
index 87ff3709bbf5..5a2c4d2293bd 100644
--- a/src/material-experimental/mdc-theming/BUILD.bazel
+++ b/src/material-experimental/mdc-theming/BUILD.bazel
@@ -32,6 +32,7 @@ sass_library(
"//src/material-experimental/mdc-table:mdc_table_scss_lib",
"//src/material-experimental/mdc-tabs:mdc_tabs_scss_lib",
"//src/material/core:core_scss_lib",
+ "//src/material/core:theming_scss_lib",
],
)
diff --git a/src/material-experimental/mdc-theming/_all-theme.scss b/src/material-experimental/mdc-theming/_all-theme.scss
index 673c3b7f22d5..e8c1d2c1f7ec 100644
--- a/src/material-experimental/mdc-theming/_all-theme.scss
+++ b/src/material-experimental/mdc-theming/_all-theme.scss
@@ -12,6 +12,7 @@
@import '../mdc-progress-bar/progress-bar-theme';
@import '../mdc-input/input-theme';
@import '../mdc-form-field/form-field-theme';
+@import '../../material/core/core';
@import '../../material/core/theming/check-duplicate-styles';
@mixin angular-material-mdc-theme($theme-or-color-config) {
diff --git a/src/material-experimental/mdc-theming/prebuilt/indigo-pink.scss b/src/material-experimental/mdc-theming/prebuilt/indigo-pink.scss
index 11d56a21ddd3..5501e3833592 100644
--- a/src/material-experimental/mdc-theming/prebuilt/indigo-pink.scss
+++ b/src/material-experimental/mdc-theming/prebuilt/indigo-pink.scss
@@ -1,6 +1,9 @@
@import '../all-theme';
@import '../../mdc-typography/all-typography';
+// Include non-theme styles for core.
+@include mat-core();
+
// Define a theme.
$primary: mat-palette($mat-indigo);
$accent: mat-palette($mat-pink, A200, A100, A400);
@@ -10,3 +13,4 @@ $theme: mat-light-theme($primary, $accent);
// Include all theme styles for the components.
@include angular-material-mdc-theme($theme);
@include angular-material-mdc-typography();
+@include mat-core-theme($theme);
diff --git a/test/benchmarks/mdc/button/BUILD.bazel b/test/benchmarks/mdc/button/BUILD.bazel
new file mode 100644
index 000000000000..f277e483fe10
--- /dev/null
+++ b/test/benchmarks/mdc/button/BUILD.bazel
@@ -0,0 +1,22 @@
+load("@npm_angular_dev_infra_private//benchmark/component_benchmark:component_benchmark.bzl", "component_benchmark")
+
+# TODO(wagnermaciel): Update this target to provide indigo-pink in a way that doesn't require having to import it with
+# stylesUrls inside the components once `component_benchmark` supports asset injection.
+
+component_benchmark(
+ name = "benchmark",
+ driver = ":button.perf-spec.ts",
+ driver_deps = [
+ "@npm//@angular/dev-infra-private",
+ "@npm//protractor",
+ "@npm//@types/jasmine",
+ ],
+ ng_deps = [
+ "@npm//@angular/core",
+ "@npm//@angular/platform-browser",
+ "//src/material-experimental/mdc-button",
+ ],
+ ng_srcs = [":app.module.ts"],
+ prefix = "",
+ styles = ["//src/material-experimental/mdc-theming:indigo_pink_prebuilt"],
+)
diff --git a/test/benchmarks/mdc/button/app.module.ts b/test/benchmarks/mdc/button/app.module.ts
new file mode 100644
index 000000000000..b60d5759f9f6
--- /dev/null
+++ b/test/benchmarks/mdc/button/app.module.ts
@@ -0,0 +1,43 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import {Component, NgModule, ViewEncapsulation} from '@angular/core';
+import {BrowserModule} from '@angular/platform-browser';
+import {MatButtonModule} from '@angular/material-experimental/mdc-button';
+
+/** component: mdc-raised-button */
+
+@Component({
+ selector: 'app-root',
+ template: `
+
+
+
+ `,
+ encapsulation: ViewEncapsulation.None,
+ styleUrls: ['//src/material-experimental/mdc-theming/prebuilt/indigo-pink.css'],
+})
+export class ButtonBenchmarkApp {
+ isChecked = false;
+ isVisible = false;
+
+ show() { this.isVisible = true; }
+ hide() { this.isVisible = false; }
+}
+
+
+@NgModule({
+ declarations: [ButtonBenchmarkApp],
+ imports: [
+ BrowserModule,
+ MatButtonModule,
+ ],
+ providers: [],
+ bootstrap: [ButtonBenchmarkApp],
+})
+export class AppModule {}
diff --git a/test/benchmarks/mdc/button/button.perf-spec.ts b/test/benchmarks/mdc/button/button.perf-spec.ts
new file mode 100644
index 000000000000..7321b9a7f495
--- /dev/null
+++ b/test/benchmarks/mdc/button/button.perf-spec.ts
@@ -0,0 +1,38 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import {$, browser} from 'protractor';
+import {runBenchmark} from '@angular/dev-infra-private/benchmark/driver-utilities';
+
+describe('button performance benchmarks', () => {
+ beforeAll(() => {
+ browser.rootEl = '#root';
+ });
+
+ it('renders a basic raised button', async() => {
+ await runBenchmark({
+ id: 'button-render',
+ url: '',
+ ignoreBrowserSynchronization: true,
+ params: [],
+ prepare: async () => await $('#hide').click(),
+ work: async () => await $('#show').click(),
+ });
+ });
+
+ it('clicks a basic raised button', async() => {
+ await runBenchmark({
+ id: 'button-click',
+ url: '',
+ ignoreBrowserSynchronization: true,
+ params: [],
+ setup: async () => await $('#show').click(),
+ work: async () => await $('.mat-mdc-raised-button').click(),
+ });
+ });
+});