diff --git a/packages/material-ui/src/StepButton/StepButton.test.js b/packages/material-ui/src/StepButton/StepButton.test.js
index c5d0a2c05f9a77..3e4856cc142054 100644
--- a/packages/material-ui/src/StepButton/StepButton.test.js
+++ b/packages/material-ui/src/StepButton/StepButton.test.js
@@ -5,6 +5,7 @@ import { createMount, getClasses } from '@material-ui/core/test-utils';
 import describeConformance from '../test-utils/describeConformance';
 import { createClientRender } from 'test/utils/createClientRender';
 import StepButton from './StepButton';
+import Step from '../Step';
 import StepLabel from '../StepLabel';
 import ButtonBase from '../ButtonBase';
 import { fireEvent } from '@testing-library/dom';
@@ -114,4 +115,17 @@ describe('<StepButton />', () => {
       expect(handleTouchStart).to.have.property('callCount', 2);
     });
   });
+
+  it('can be used as a child of `Step`', () => {
+    // a simple smoke test to check that these two
+    // integrate without any errors/warnings
+    // TODO: move into integration test for Stepper component
+    const { getByRole } = render(
+      <Step>
+        <StepButton>Next</StepButton>
+      </Step>,
+    );
+
+    expect(getByRole('button')).to.be.ok;
+  });
 });