diff --git a/plugins/scaffolder-react/src/next/components/Stepper/Stepper.test.tsx b/plugins/scaffolder-react/src/next/components/Stepper/Stepper.test.tsx
index 2bb66fd782..d7e271f8b3 100644
--- a/plugins/scaffolder-react/src/next/components/Stepper/Stepper.test.tsx
+++ b/plugins/scaffolder-react/src/next/components/Stepper/Stepper.test.tsx
@@ -21,6 +21,7 @@ import { act, fireEvent } from '@testing-library/react';
 import type { RJSFValidationError } from '@rjsf/utils';
 import { JsonValue } from '@backstage/types';
 import { FieldExtensionComponentProps } from '../../../extensions';
+import { SecretsContextProvider } from '../../../secrets';
 import { LayoutTemplate } from '../../../layouts';
 
 describe('Stepper', () => {
@@ -34,7 +35,9 @@ describe('Stepper', () => {
     };
 
     const { getByText } = await renderInTestApp(
-      <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />,
+      <SecretsContextProvider>
+        <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />
+      </SecretsContextProvider>,
     );
 
     for (const step of manifest.steps) {
@@ -52,7 +55,9 @@ describe('Stepper', () => {
     };
 
     const { getByRole } = await renderInTestApp(
-      <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />,
+      <SecretsContextProvider>
+        <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />
+      </SecretsContextProvider>,
     );
 
     expect(getByRole('button', { name: 'Next' })).toBeInTheDocument();
@@ -92,7 +97,9 @@ describe('Stepper', () => {
     };
 
     const { getByRole } = await renderInTestApp(
-      <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />,
+      <SecretsContextProvider>
+        <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />
+      </SecretsContextProvider>,
     );
 
     await fireEvent.change(getByRole('textbox', { name: 'name' }), {
@@ -140,7 +147,9 @@ describe('Stepper', () => {
     };
 
     const { getByRole, getByLabelText } = await renderInTestApp(
-      <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />,
+      <SecretsContextProvider>
+        <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />
+      </SecretsContextProvider>,
     );
 
     await fireEvent.change(getByRole('textbox', { name: 'name' }), {
@@ -219,14 +228,16 @@ describe('Stepper', () => {
     });
 
     const { getByRole } = await renderInTestApp(
-      <Stepper
-        manifest={manifest}
-        onCreate={onCreate}
-        extensions={[
-          { name: 'Repo', component: Repo },
-          { name: 'Owner', component: Owner },
-        ]}
-      />,
+      <SecretsContextProvider>
+        <Stepper
+          manifest={manifest}
+          onCreate={onCreate}
+          extensions={[
+            { name: 'Repo', component: Repo },
+            { name: 'Owner', component: Owner },
+          ]}
+        />
+      </SecretsContextProvider>,
     );
 
     await fireEvent.change(getByRole('textbox', { name: 'repo' }), {
@@ -275,11 +286,13 @@ describe('Stepper', () => {
     };
 
     const { getByText } = await renderInTestApp(
-      <Stepper
-        manifest={manifest}
-        extensions={[{ name: 'Mock', component: MockComponent }]}
-        onCreate={jest.fn()}
-      />,
+      <SecretsContextProvider>
+        <Stepper
+          manifest={manifest}
+          extensions={[{ name: 'Mock', component: MockComponent }]}
+          onCreate={jest.fn()}
+        />
+      </SecretsContextProvider>,
     );
 
     expect(getByText('im a custom field extension')).toBeInTheDocument();
@@ -308,17 +321,19 @@ describe('Stepper', () => {
     };
 
     const { getByRole } = await renderInTestApp(
-      <Stepper
-        manifest={manifest}
-        extensions={[
-          {
-            name: 'Mock',
-            component: MockComponent,
-            validation: async () => new Promise(r => setTimeout(r, 1000)),
-          },
-        ]}
-        onCreate={jest.fn()}
-      />,
+      <SecretsContextProvider>
+        <Stepper
+          manifest={manifest}
+          extensions={[
+            {
+              name: 'Mock',
+              component: MockComponent,
+              validation: async () => new Promise(r => setTimeout(r, 1000)),
+            },
+          ]}
+          onCreate={jest.fn()}
+        />
+      </SecretsContextProvider>,
     );
 
     act(() => {
@@ -356,12 +371,14 @@ describe('Stepper', () => {
     };
 
     const { getByText, getByRole } = await renderInTestApp(
-      <Stepper
-        manifest={manifest}
-        extensions={[]}
-        onCreate={jest.fn()}
-        formProps={{ transformErrors }}
-      />,
+      <SecretsContextProvider>
+        <Stepper
+          manifest={manifest}
+          extensions={[]}
+          onCreate={jest.fn()}
+          formProps={{ transformErrors }}
+        />
+      </SecretsContextProvider>,
     );
 
     await fireEvent.change(getByRole('textbox', { name: 'postcode' }), {
@@ -401,7 +418,9 @@ describe('Stepper', () => {
     });
 
     const { getByRole } = await renderInTestApp(
-      <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />,
+      <SecretsContextProvider>
+        <Stepper manifest={manifest} extensions={[]} onCreate={jest.fn()} />
+      </SecretsContextProvider>,
     );
 
     expect(getByRole('textbox', { name: 'firstName' })).toHaveValue('John');
@@ -429,7 +448,9 @@ describe('Stepper', () => {
     });
 
     const { getByRole } = await renderInTestApp(
-      <Stepper manifest={manifest} extensions={[]} onCreate={onCreate} />,
+      <SecretsContextProvider>
+        <Stepper manifest={manifest} extensions={[]} onCreate={onCreate} />
+      </SecretsContextProvider>,
     );
 
     await act(async () => {
@@ -464,15 +485,17 @@ describe('Stepper', () => {
     };
 
     const { getByRole } = await renderInTestApp(
-      <Stepper
-        manifest={manifest}
-        onCreate={jest.fn()}
-        extensions={[]}
-        components={{
-          createButtonText: <b>Make</b>,
-          reviewButtonText: <i>Inspect</i>,
-        }}
-      />,
+      <SecretsContextProvider>
+        <Stepper
+          manifest={manifest}
+          onCreate={jest.fn()}
+          extensions={[]}
+          components={{
+            createButtonText: <b>Make</b>,
+            reviewButtonText: <i>Inspect</i>,
+          }}
+        />
+      </SecretsContextProvider>,
     );
 
     await act(async () => {
@@ -516,12 +539,14 @@ describe('Stepper', () => {
       };
 
       const { getByText, getByRole } = await renderInTestApp(
-        <Stepper
-          manifest={manifest}
-          extensions={[]}
-          onCreate={jest.fn()}
-          layouts={[{ name: 'Layout', component: ScaffolderLayout }]}
-        />,
+        <SecretsContextProvider>
+          <Stepper
+            manifest={manifest}
+            extensions={[]}
+            onCreate={jest.fn()}
+            layouts={[{ name: 'Layout', component: ScaffolderLayout }]}
+          />
+        </SecretsContextProvider>,
       );
 
       expect(getByText('A Scaffolder Layout')).toBeInTheDocument();
diff --git a/plugins/scaffolder-react/src/next/components/Workflow/Workflow.tsx b/plugins/scaffolder-react/src/next/components/Workflow/Workflow.tsx
index c6030930c5..c2ea544463 100644
--- a/plugins/scaffolder-react/src/next/components/Workflow/Workflow.tsx
+++ b/plugins/scaffolder-react/src/next/components/Workflow/Workflow.tsx
@@ -111,11 +111,13 @@ export const Workflow = (workflowProps: WorkflowProps): JSX.Element | null => {
           noPadding
           titleTypographyProps={{ component: 'h2' }}
         >
-          <Stepper
-            manifest={sortedManifest}
-            templateName={templateName}
-            {...props}
-          />
+          <SecretsContextProvider>
+            <Stepper
+              manifest={sortedManifest}
+              templateName={templateName}
+              {...props}
+            />
+          </SecretsContextProvider>
         </InfoCard>
       )}
     </Content>
@@ -123,10 +125,8 @@ export const Workflow = (workflowProps: WorkflowProps): JSX.Element | null => {
 };
 
 /**
+ * TODO(blam): work out what we want to do with these components in the new API.
+ * Should we really have EmbeddableWorkflow -> Workflow -> Stepper -> Form, or should we revisit this?
  * @alpha
  */
-export const EmbeddableWorkflow = (props: WorkflowProps) => (
-  <SecretsContextProvider>
-    <Workflow {...props} />
-  </SecretsContextProvider>
-);
+export const EmbeddableWorkflow = Workflow;
diff --git a/plugins/scaffolder/src/components/fields/SecretInput/SecretInput.test.tsx b/plugins/scaffolder/src/components/fields/SecretInput/SecretInput.test.tsx
index a73f6a8fda..fa810b9d17 100644
--- a/plugins/scaffolder/src/components/fields/SecretInput/SecretInput.test.tsx
+++ b/plugins/scaffolder/src/components/fields/SecretInput/SecretInput.test.tsx
@@ -32,43 +32,6 @@ describe('<SecretInput />', () => {
     );
   };
 
-  it('should set the current form value as a mask for the value entered', async () => {
-    const mockSecret = 'backstage';
-    const onSubmit = jest.fn();
-
-    const { getByLabelText, getByRole } = await renderInTestApp(
-      <SecretsContextProvider>
-        <Form
-          validator={validator}
-          schema={{ type: 'string', title: 'secret' }}
-          uiSchema={{
-            'ui:field': 'Secret',
-          }}
-          fields={{
-            Secret: SecretInput,
-          }}
-          onSubmit={onSubmit}
-        />
-        <SecretsComponent />
-      </SecretsContextProvider>,
-    );
-
-    const secretInput = getByLabelText('secret');
-    const submitButton = getByRole('button');
-
-    await act(async () => {
-      fireEvent.change(secretInput, { target: { value: mockSecret } });
-      fireEvent.click(submitButton);
-    });
-
-    expect(onSubmit).toHaveBeenCalledWith(
-      expect.objectContaining({
-        formData: '*********',
-      }),
-      expect.anything(),
-    );
-  });
-
   it('should set the secret value to the unmasked value', async () => {
     const mockSecret = 'backstage';
     const onSubmit = jest.fn();