diff --git a/src/components/SaveButton/SaveButton.test.js b/src/components/SaveButton/SaveButton.test.js
index 146720e0d..6ee83cd4f 100644
--- a/src/components/SaveButton/SaveButton.test.js
+++ b/src/components/SaveButton/SaveButton.test.js
@@ -1,8 +1,6 @@
 import React from "react";
-import { fireEvent, render, screen } from "@testing-library/react";
-import { Provider } from "react-redux";
-import configureStore from "redux-mock-store";
-import { triggerSave } from "../../redux/EditorSlice";
+import { fireEvent, screen } from "@testing-library/react";
+import renderWithProviders from "../../utils/renderWithProviders";
 import SaveButton from "./SaveButton";
 
 const logInHandler = jest.fn();
@@ -17,9 +15,7 @@ describe("When project is loaded", () => {
 
     describe("who doesn't own the project", () => {
       beforeEach(() => {
-        const middlewares = [];
-        const mockStore = configureStore(middlewares);
-        const initialState = {
+        const preloadedState = {
           editor: {
             loading: "success",
             webComponent: true,
@@ -36,12 +32,9 @@ describe("When project is loaded", () => {
             },
           },
         };
-        store = mockStore(initialState);
-        render(
-          <Provider store={store}>
-            <SaveButton />
-          </Provider>,
-        );
+        ({ store } = renderWithProviders(<SaveButton />, {
+          preloadedState,
+        }));
       });
 
       test("Save button renders", () => {
@@ -54,10 +47,10 @@ describe("When project is loaded", () => {
         ).not.toBeInTheDocument();
       });
 
-      test("Clicking save dispatches trigger save action", () => {
+      test("Clicking save updates the save-triggered state", () => {
         const saveButton = screen.queryByText("header.save");
         fireEvent.click(saveButton);
-        expect(store.getActions()).toEqual([triggerSave()]);
+        expect(store.getState().editor.saveTriggered).toBe(true);
       });
 
       test("Clicking save triggers a logInHandler event", () => {
@@ -69,9 +62,7 @@ describe("When project is loaded", () => {
 
     describe("who does own the project", () => {
       beforeEach(() => {
-        const middlewares = [];
-        const mockStore = configureStore(middlewares);
-        const initialState = {
+        const preloadedState = {
           editor: {
             loading: "success",
             webComponent: true,
@@ -88,12 +79,9 @@ describe("When project is loaded", () => {
             },
           },
         };
-        store = mockStore(initialState);
-        render(
-          <Provider store={store}>
-            <SaveButton />
-          </Provider>,
-        );
+        ({ store } = renderWithProviders(<SaveButton />, {
+          preloadedState,
+        }));
       });
 
       test("Does not render save button", () => {
@@ -112,21 +100,16 @@ describe("When project is loaded", () => {
     let store;
 
     beforeEach(() => {
-      const middlewares = [];
-      const mockStore = configureStore(middlewares);
-      const initialState = {
+      const preloadedState = {
         editor: {
           loading: "success",
           webComponent: false,
         },
         auth: {},
       };
-      store = mockStore(initialState);
-      render(
-        <Provider store={store}>
-          <SaveButton />
-        </Provider>,
-      );
+      ({ store } = renderWithProviders(<SaveButton />, {
+        preloadedState,
+      }));
     });
 
     test("Login to save button renders", () => {
@@ -137,10 +120,10 @@ describe("When project is loaded", () => {
       expect(screen.queryByText("header.save")).not.toBeInTheDocument();
     });
 
-    test("Clicking save dispatches trigger save action", () => {
+    test("Clicking save updates the save-triggered state", () => {
       const saveButton = screen.queryByText("header.loginToSave");
       fireEvent.click(saveButton);
-      expect(store.getActions()).toEqual([triggerSave()]);
+      expect(store.getState().editor.saveTriggered).toBe(true);
     });
 
     test("Clicking save triggers a logInHandler event", () => {
@@ -151,24 +134,17 @@ describe("When project is loaded", () => {
   });
 
   describe("with webComponent=false", () => {
-    let store;
-
     beforeEach(() => {
-      const middlewares = [];
-      const mockStore = configureStore(middlewares);
-      const initialState = {
+      const preloadedState = {
         editor: {
           loading: "success",
           webComponent: false,
         },
         auth: {},
       };
-      store = mockStore(initialState);
-      render(
-        <Provider store={store}>
-          <SaveButton />
-        </Provider>,
-      );
+      renderWithProviders(<SaveButton />, {
+        preloadedState,
+      });
     });
 
     test("Renders a secondary button", () => {
@@ -178,24 +154,17 @@ describe("When project is loaded", () => {
   });
 
   describe("with webComponent=true", () => {
-    let store;
-
     beforeEach(() => {
-      const middlewares = [];
-      const mockStore = configureStore(middlewares);
-      const initialState = {
+      const preloadedState = {
         editor: {
           loading: "success",
           webComponent: true,
         },
         auth: {},
       };
-      store = mockStore(initialState);
-      render(
-        <Provider store={store}>
-          <SaveButton />
-        </Provider>,
-      );
+      renderWithProviders(<SaveButton />, {
+        preloadedState,
+      });
     });
 
     test("Renders a primary button", () => {
@@ -211,17 +180,12 @@ describe("When project is loaded", () => {
 
 describe("When project is not loaded", () => {
   beforeEach(() => {
-    const middlewares = [];
-    const mockStore = configureStore(middlewares);
-    const store = mockStore({
-      editor: {},
-      auth: {},
+    renderWithProviders(<SaveButton />, {
+      preloadedState: {
+        editor: {},
+        auth: {},
+      },
     });
-    render(
-      <Provider store={store}>
-        <SaveButton />
-      </Provider>,
-    );
   });
 
   test("Does not render a login to save button", () => {
diff --git a/src/utils/renderWithProviders.js b/src/utils/renderWithProviders.js
new file mode 100644
index 000000000..067bb4a28
--- /dev/null
+++ b/src/utils/renderWithProviders.js
@@ -0,0 +1,23 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import { Provider } from "react-redux";
+import { configureStore } from "@reduxjs/toolkit";
+import rootReducer from "../redux/RootSlice";
+
+const renderWithProviders = (
+  ui,
+  { preloadedState, store, reducer = rootReducer, ...renderOptions } = {},
+) => {
+  const testStore = store || configureStore({ reducer, preloadedState });
+
+  const Wrapper = ({ children }) => (
+    <Provider store={testStore}>{children}</Provider>
+  );
+
+  return {
+    store: testStore,
+    ...render(ui, { wrapper: Wrapper, ...renderOptions }),
+  };
+};
+
+export default renderWithProviders;