diff --git a/superglue/.babelrc.js b/superglue/.babelrc.js
index cdd162e7..745f03ba 100644
--- a/superglue/.babelrc.js
+++ b/superglue/.babelrc.js
@@ -2,18 +2,14 @@ module.exports = {
   plugins: [],
   presets: [
     [
-      "@babel/preset-env",
+      '@babel/preset-env',
       {
-        useBuiltIns: "entry",
-        corejs: "2",
+        useBuiltIns: 'entry',
+        corejs: '2',
         loose: true,
-      }
-    ],
-    [
-      "@babel/preset-react"
-    ],
-    [
-      "@babel/preset-typescript"
+      },
     ],
+    ['@babel/preset-react'],
+    ['@babel/preset-typescript'],
   ],
-};
+}
diff --git a/superglue/.gitignore b/superglue/.gitignore
index 9a853f25..3b7f80dd 100644
--- a/superglue/.gitignore
+++ b/superglue/.gitignore
@@ -61,3 +61,6 @@ typings/
 dist/
 
 package-lock.json
+
+coverage/
+todo.txt
\ No newline at end of file
diff --git a/superglue/.prettierignore b/superglue/.prettierignore
new file mode 100644
index 00000000..4bbc1712
--- /dev/null
+++ b/superglue/.prettierignore
@@ -0,0 +1,6 @@
+# Ignore artifacts:
+dist
+coverage
+
+# Ignore all HTML files:
+**/*.html
\ No newline at end of file
diff --git a/superglue/lib/index.tsx b/superglue/lib/index.tsx
index 585b2e79..808035bf 100644
--- a/superglue/lib/index.tsx
+++ b/superglue/lib/index.tsx
@@ -56,11 +56,11 @@ function pageToInitialState(key: string, page: VisitResponse) {
   const nextPage: Page = {
     ...page,
     pageKey: key, //TODO remove this
-    savedAt: Date.now()
+    savedAt: Date.now(),
   }
 
   return {
-    pages: { [key]: nextPage},
+    pages: { [key]: nextPage },
     ...slices,
   }
 }
@@ -70,7 +70,12 @@ function start({
   baseUrl = config.baseUrl,
   maxPages = config.maxPages,
   path,
-}: {initialPage: VisitResponse, baseUrl: string, maxPages?: number, path: string}) {
+}: {
+  initialPage: VisitResponse
+  baseUrl: string
+  maxPages?: number
+  path: string
+}) {
   const initialPageKey = urlToPageKey(parse(path).href)
   const { csrfToken } = initialPage
   const location = parse(path)
@@ -97,24 +102,17 @@ function start({
   }
 }
 
-class NotImplementedError extends Error {
-  constructor(message: string) {
-    super(message)
-    this.name = this.constructor.name
-  }
-}
-
 interface Props {
   initialPage: VisitResponse
   baseUrl: string
   path: string
   appEl: HTMLElement
 }
-  
+
 type ConnectedMapping = Record<
-    string,
-    ConnectedComponent<React.ComponentType, PageOwnProps>
-  >
+  string,
+  ConnectedComponent<React.ComponentType, PageOwnProps>
+>
 
 export abstract class ApplicationBase extends React.Component<Props> {
   public hasWindow: boolean
@@ -122,7 +120,7 @@ export abstract class ApplicationBase extends React.Component<Props> {
   public initialPageKey: string
   public store: SuperglueStore
   public history: History
-  public connectedMapping: ConnectedMapping 
+  public connectedMapping: ConnectedMapping
   public ujsHandlers: Handlers
   public visit: Visit
   public remote: Remote
@@ -176,12 +174,11 @@ export abstract class ApplicationBase extends React.Component<Props> {
     this.remote = remote
   }
 
-  visitAndRemote(
+  abstract visitAndRemote(
     // eslint-disable-next-line
-    navigatorRef: React.RefObject<Nav>, store: SuperglueStore
-  ): { visit: Visit; remote: Remote } {
-    throw new NotImplementedError('Implement this')
-  }
+    navigatorRef: React.RefObject<Nav>,
+    store: SuperglueStore
+  ): { visit: Visit; remote: Remote }
 
   componentDidMount(): void {
     const { appEl } = this.props
@@ -207,7 +204,7 @@ export abstract class ApplicationBase extends React.Component<Props> {
   }
 
   abstract buildStore(
-    initialState: {pages: AllPages, [key: string]: JSONValue},
+    initialState: { pages: AllPages; [key: string]: JSONValue },
     reducer: typeof rootReducer
   ): SuperglueStore
 
diff --git a/superglue/package.json b/superglue/package.json
index 89be5f86..5b96065d 100644
--- a/superglue/package.json
+++ b/superglue/package.json
@@ -3,39 +3,55 @@
   "version": "0.53.4",
   "description": "Use a vanilla Rails with React and Redux",
   "scripts": {
-    "test": "vitest --config ./vitest.config.ts",
-    "lint": "eslint 'lib/**/*.{js,ts,tsx}'",
-    "clean": "rm -rf ./dist",
-    "copy:package": "cat ./package.json | jq 'del(.scripts)' > dist/package.json",
-    "copy:readme": "cp ../README.md dist/",
-    "build": "npm run clean && npm run build:js && npm run copy:package && npm run copy:readme",
-    "build:js": "babel lib --out-dir dist --extensions \".ts,.tsx\"",
-    "type-check": "tsc --noEmit",
-    "type-check:watch": "npm run type-check -- --watch",
-    "prepublishOnly": "npm run build"
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "clean": "rm -rf dist",
+    "lint": "run-p lint:eslint lint:types lint:prettier",
+    "lint:eslint": "eslint --max-warnings=0 --ext js,jsx,ts,tsx ./lib",
+    "lint:prettier": "prettier --check '**/*' --ignore-unknown",
+    "lint:types": "tsc",
+    "fix:prettier": "prettier --write '**/*' --ignore-unknown",
+    "test": "vitest",
+    "test:run": "vitest run",
+    "test:cov": "vitest --coverage",
+    "test:all": "npm lint && npm test:run",
+    "pub:beta": "npm build && npm publish --tag beta",
+    "pub:release": "npm build && npm publish"
   },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/thoughtbot/superglue.git"
   },
   "author": "Johny Ho",
+  "main": "dist/cjs/superglue.cjs",
+  "module": "dist/superglue.mjs",
+  "types": "dist/superglue.d.mts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./dist/superglue.d.mts",
+      "import": "./dist/superglue.mjs",
+      "default": "./dist/cjs/superglue.cjs"
+    },
+    "./action_creators": {
+      "types": "./dist/action_creators.d.mts",
+      "import": "./dist/action_creators.mjs",
+      "default": "./dist/cjs/action_creators.cjs"
+    }
+  },
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/thoughtbot/superglue/issues"
   },
   "homepage": "https://github.com/thoughtbot/superglue#readme",
   "devDependencies": {
-    "@babel/cli": "^7.14.3",
-    "@babel/core": "^7.14.3",
-    "@babel/preset-env": "^7.14.4",
-    "@babel/preset-react": "^7.13.13",
-    "@babel/preset-typescript": "^7.24.6",
     "@reduxjs/toolkit": "^2.2.5",
     "@types/url-parse": "^1.4.11",
     "@typescript-eslint/eslint-plugin": "^7.15.0",
     "@typescript-eslint/parser": "^7.15.0",
     "@vitejs/plugin-react": "^4.3.1",
-    "core-js": "^2.6.12",
+    "@vitest/coverage-v8": "^2.0.2",
+    "abortcontroller-polyfill": "^1.7.3",
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.6",
     "eslint": "^8.57.0",
@@ -44,15 +60,16 @@
     "fetch-mock": "^9.11.0",
     "jsdom": "^24.1.0",
     "node-fetch": "^2.6.1",
+    "npm-run-all": "^4.1.5",
     "prettier": "^2.3.1",
     "prettier-eslint": "^16.3.0",
-    "prop-types": "^15.7.2",
     "react": "^16.4.0",
     "react-dom": "^16.4.0",
     "react-redux": "^7.2.4",
     "redux": "^5.0.1",
     "redux-mock-store": "^1.5.4",
     "redux-thunk": "^3.1.0",
+    "tsup": "^8.1.0",
     "typescript": "^5.5.3",
     "vitest": "^2.0.2"
   },
@@ -63,7 +80,6 @@
     "redux-thunk": ">=2.3"
   },
   "dependencies": {
-    "abortcontroller-polyfill": "^1.7.3",
     "history": "^5.3.0",
     "url-parse": "^1.5.1"
   }
diff --git a/superglue/spec/features/navigation.spec.jsx b/superglue/spec/features/navigation.spec.jsx
index 9f8319bd..ca4272c6 100644
--- a/superglue/spec/features/navigation.spec.jsx
+++ b/superglue/spec/features/navigation.spec.jsx
@@ -13,8 +13,7 @@ import { mount } from 'enzyme'
 import { thunk } from 'redux-thunk'
 import 'regenerator-runtime/runtime'
 
-const flushPromises = () =>
-  new Promise((res) => process.nextTick(res))
+const flushPromises = () => new Promise((res) => process.nextTick(res))
 
 process.on('unhandledRejection', (r) => console.error(r))
 
@@ -61,10 +60,7 @@ class App extends ApplicationBase {
     return this.props.history
   }
 
-  buildStore(
-    initialState,
-    reducer
-  ) {
+  buildStore(initialState, reducer) {
     const store = createStore(
       combineReducers(reducer),
       initialState,
@@ -73,7 +69,6 @@ class App extends ApplicationBase {
 
     return store
   }
-
 }
 
 describe('start', () => {
@@ -136,7 +131,7 @@ fetchMock.mock()
 
 describe('navigation', () => {
   beforeEach(() => {
-    vi.spyOn(window, 'scrollTo').mockImplementation(() => {});
+    vi.spyOn(window, 'scrollTo').mockImplementation(() => {})
     fetchMock.restore()
   })
 
@@ -260,56 +255,57 @@ describe('navigation', () => {
     })
 
     describe('and the action is to a non-superglue app', () => {
-      it('does nothing to the store', () => new Promise(done => {
-        const history = createMemoryHistory({
-          initialEntries: ['/bar'],
-          initialIndex: 0,
-        })
-        let navComponent
+      it('does nothing to the store', () =>
+        new Promise((done) => {
+          const history = createMemoryHistory({
+            initialEntries: ['/bar'],
+            initialIndex: 0,
+          })
+          let navComponent
 
-        history.listen(({ action, location }) => {
-          const { pathname } = location
+          history.listen(({ action, location }) => {
+            const { pathname } = location
 
-          if (pathname == '/some_html_page') {
-            const state = store.getState()
-            expect(state.superglue.currentPageKey).toEqual('/bar')
-            expect(navComponent.state.pageKey).toEqual('/bar')
-            done()
-          }
-        })
-
-        const initialPage = {
-          data: {
-            heading: 'this is page 1',
-          },
-          componentIdentifier: 'home',
-          assets: ['123.js', '123.css'],
-          fragments: [],
-          csrfToken: 'token',
-          restoreStrategy: 'fromCacheOnly'
-        }
+            if (pathname == '/some_html_page') {
+              const state = store.getState()
+              expect(state.superglue.currentPageKey).toEqual('/bar')
+              expect(navComponent.state.pageKey).toEqual('/bar')
+              done()
+            }
+          })
 
-        class ExampleHome extends Home {
-          componentDidMount() {
-            process.nextTick(() => history.push('/some_html_page'))
+          const initialPage = {
+            data: {
+              heading: 'this is page 1',
+            },
+            componentIdentifier: 'home',
+            assets: ['123.js', '123.css'],
+            fragments: [],
+            csrfToken: 'token',
+            restoreStrategy: 'fromCacheOnly',
           }
-        }
 
-        const component = mount(
-          <App
-            initialPage={initialPage}
-            baseUrl={'http://example.com'}
-            path={'/bar'}
-            appEl={document}
-            mapping={{ home: ExampleHome }}
-            history={history}
-          />
-        )
-        const store = component.instance().store
-        navComponent = component.find(Nav).instance()
+          class ExampleHome extends Home {
+            componentDidMount() {
+              process.nextTick(() => history.push('/some_html_page'))
+            }
+          }
 
-        expect(component.find(ExampleHome).exists()).toBe(true)
-      }))
+          const component = mount(
+            <App
+              initialPage={initialPage}
+              baseUrl={'http://example.com'}
+              path={'/bar'}
+              appEl={document}
+              mapping={{ home: ExampleHome }}
+              history={history}
+            />
+          )
+          const store = component.instance().store
+          navComponent = component.find(Nav).instance()
+
+          expect(component.find(ExampleHome).exists()).toBe(true)
+        }))
     })
   })
 
@@ -395,7 +391,7 @@ describe('navigation', () => {
           baseUrl={'http://example.com'}
           path={'/bar'}
           appEl={document}
-          mapping={{ home: ExampleHome}}
+          mapping={{ home: ExampleHome }}
           history={history}
         />
       )
@@ -430,7 +426,7 @@ describe('navigation', () => {
         assets: ['123.js', '123.css'],
         fragments: [],
         csrfToken: 'token',
-        restoreStrategy: 'fromCacheOnly'
+        restoreStrategy: 'fromCacheOnly',
       }
 
       const component = mount(
@@ -439,7 +435,7 @@ describe('navigation', () => {
           baseUrl={'http://example.com'}
           path={'/bar'}
           appEl={document}
-          mapping={{ home:Home, about: About}}
+          mapping={{ home: Home, about: About }}
           history={history}
         />
       )
@@ -477,58 +473,59 @@ describe('navigation', () => {
       expect(navComponent.state.pageKey).toEqual('/bar')
     })
 
-    it('does not change current page when the hash changes', () => new Promise(done => {
-      const history = createMemoryHistory({})
-      history.push("/bar#title", {
-        superglue: true,
-        pageKey: '/bar',
-      })
-      history.push("/bar") // Gets replaced on Superglue.start
-      let store, navComponent;
-
-      history.listen(({action, location}) => {
-        const { pathname, hash } = location
-        if (hash === '#title') {
-          const state = store.getState()
-          expect(state.superglue.currentPageKey).toEqual('/bar')
-          expect(navComponent.state.pageKey).toEqual('/bar')
-          expect(pathname).toEqual('/bar')
-          expect(hash).toEqual('#title')
-          done()
-        }
-      })
+    it('does not change current page when the hash changes', () =>
+      new Promise((done) => {
+        const history = createMemoryHistory({})
+        history.push('/bar#title', {
+          superglue: true,
+          pageKey: '/bar',
+        })
+        history.push('/bar') // Gets replaced on Superglue.start
+        let store, navComponent
 
-      const initialPage = {
-        data: {
-          heading: 'this is page 1',
-        },
-        componentIdentifier: 'home',
-        assets: ['123.js', '123.css'],
-        fragments: [],
-        csrfToken: 'token',
-        restoreStrategy: 'fromCacheOnly'
-      }
+        history.listen(({ action, location }) => {
+          const { pathname, hash } = location
+          if (hash === '#title') {
+            const state = store.getState()
+            expect(state.superglue.currentPageKey).toEqual('/bar')
+            expect(navComponent.state.pageKey).toEqual('/bar')
+            expect(pathname).toEqual('/bar')
+            expect(hash).toEqual('#title')
+            done()
+          }
+        })
 
-      class ExampleHome extends Home {
-        componentDidMount() {
-          process.nextTick(() => history.back())
+        const initialPage = {
+          data: {
+            heading: 'this is page 1',
+          },
+          componentIdentifier: 'home',
+          assets: ['123.js', '123.css'],
+          fragments: [],
+          csrfToken: 'token',
+          restoreStrategy: 'fromCacheOnly',
         }
-      }
 
-      const component = mount(
-        <App
-          initialPage={initialPage}
-          baseUrl={'http://example.com'}
-          path={'/bar'}
-          appEl={document}
-          mapping={{ home: ExampleHome }}
-          history={history}
-        />
-      )
+        class ExampleHome extends Home {
+          componentDidMount() {
+            process.nextTick(() => history.back())
+          }
+        }
 
-      store = component.instance().store
-      navComponent = component.find(Nav).instance()
-    }))
+        const component = mount(
+          <App
+            initialPage={initialPage}
+            baseUrl={'http://example.com'}
+            path={'/bar'}
+            appEl={document}
+            mapping={{ home: ExampleHome }}
+            history={history}
+          />
+        )
+
+        store = component.instance().store
+        navComponent = component.find(Nav).instance()
+      }))
 
     it('requests the evicted page when encountering the page again using browser buttons', async () => {
       const history = createMemoryHistory({})
@@ -557,7 +554,7 @@ describe('navigation', () => {
           baseUrl={'http://example.com'}
           path={'/bar'}
           appEl={document}
-          mapping={{ home: Home, about: About}}
+          mapping={{ home: Home, about: About }}
           history={history}
         />
       )
@@ -610,7 +607,7 @@ describe('navigation', () => {
           baseUrl={'http://example.com'}
           path={'/foo'}
           appEl={document}
-          mapping={{ home: ExampleHome}}
+          mapping={{ home: ExampleHome }}
           history={history}
         />
       )
@@ -618,7 +615,10 @@ describe('navigation', () => {
 
       const mockResponse = rsp.graftSuccessWithNewZip()
       mockResponse.headers['x-response-url'] = '/foo'
-      fetchMock.mock('http://example.com/foo?props_at=address&format=json', mockResponse)
+      fetchMock.mock(
+        'http://example.com/foo?props_at=address&format=json',
+        mockResponse
+      )
 
       component.find('button').simulate('click')
       await flushPromises()
diff --git a/superglue/spec/helpers/polyfill.js b/superglue/spec/helpers/polyfill.js
index fc639932..84eec21d 100644
--- a/superglue/spec/helpers/polyfill.js
+++ b/superglue/spec/helpers/polyfill.js
@@ -1,27 +1,29 @@
 import { AbortController } from 'abortcontroller-polyfill/dist/cjs-ponyfill'
-import { TextEncoder, TextDecoder } from 'util';
+import { TextEncoder, TextDecoder } from 'util'
 import { JSDOM } from 'jsdom'
 
 function setUpDomEnvironment() {
-  const dom = new JSDOM('<!doctype html><html><body></body></html>', {url: 'http://localhost/'});
-  const { window } = dom;
+  const dom = new JSDOM('<!doctype html><html><body></body></html>', {
+    url: 'http://localhost/',
+  })
+  const { window } = dom
 
-  global.window = window;
-  global.document = window.document;
+  global.window = window
+  global.document = window.document
   global.navigator = {
-      userAgent: 'node.js',
-  };
-  copyProps(window, global);
+    userAgent: 'node.js',
+  }
+  copyProps(window, global)
 }
 
 function copyProps(src, target) {
   const props = Object.getOwnPropertyNames(src)
-      .filter(prop => typeof target[prop] === 'undefined')
-      .map(prop => Object.getOwnPropertyDescriptor(src, prop));
-  Object.defineProperties(target, props);
+    .filter((prop) => typeof target[prop] === 'undefined')
+    .map((prop) => Object.getOwnPropertyDescriptor(src, prop))
+  Object.defineProperties(target, props)
 }
 
-setUpDomEnvironment();
+setUpDomEnvironment()
 
 global.AbortController = AbortController
 global.TextEncoder = TextEncoder
diff --git a/superglue/spec/lib/NavComponent.spec.jsx b/superglue/spec/lib/NavComponent.spec.jsx
index 4f8adc8a..ac378b08 100644
--- a/superglue/spec/lib/NavComponent.spec.jsx
+++ b/superglue/spec/lib/NavComponent.spec.jsx
@@ -1,4 +1,4 @@
-import {describe, it, expect, vi} from 'vitest'
+import { describe, it, expect, vi } from 'vitest'
 import { JSDOM } from 'jsdom'
 import React from 'react'
 import fetchMock from 'fetch-mock'
@@ -39,26 +39,31 @@ describe('Nav', () => {
   describe('navigateTo', () => {
     it('navigates to the specified page', () => {
       const history = createMemoryHistory({})
-      history.push("/bar", {
+      history.push('/bar', {
         superglue: true,
         pageKey: '/bar',
         posX: 0,
-        posY: 0
+        posY: 0,
       })
       let expected = '<div><h1>About Page</h1></div>'
 
-      class ExampleAbout extends About {
-      }
+      class ExampleAbout extends About {}
 
       const mockStore = configureMockStore()
       const store = mockStore({
         pages: {
-          '/foo': { componentIdentifier: 'about', restoreStrategy: 'fromCacheOnly' },
-          '/bar': { componentIdentifier: 'home', restoreStrategy: 'fromCacheOnly' },
+          '/foo': {
+            componentIdentifier: 'about',
+            restoreStrategy: 'fromCacheOnly',
+          },
+          '/bar': {
+            componentIdentifier: 'home',
+            restoreStrategy: 'fromCacheOnly',
+          },
         },
         superglue: {
-          csrfToken: "abc"
-        }
+          csrfToken: 'abc',
+        },
       })
 
       const component = mount(
@@ -71,7 +76,7 @@ describe('Nav', () => {
           />
         </Provider>
       )
-      const scrollTo = vi.spyOn(window, 'scrollTo').mockImplementation(() => {});
+      const scrollTo = vi.spyOn(window, 'scrollTo').mockImplementation(() => {})
       expect(component.find(Home).exists()).toBe(true)
       expect(component.find(About).exists()).toBe(false)
 
@@ -87,11 +92,14 @@ describe('Nav', () => {
       const mockStore = configureMockStore()
       const store = mockStore({
         pages: {
-          '/bar': { componentIdentifier: 'home', restoreStrategy: 'fromCacheOnly' },
+          '/bar': {
+            componentIdentifier: 'home',
+            restoreStrategy: 'fromCacheOnly',
+          },
         },
         superglue: {
-          csrfToken: "abc"
-        }
+          csrfToken: 'abc',
+        },
       })
 
       const component = mount(
@@ -116,23 +124,29 @@ describe('Nav', () => {
 
     it('navigates to the specified page and calls the action when used with react-redux', () => {
       const history = createMemoryHistory({})
-      history.push("/bar", {
+      history.push('/bar', {
         superglue: true,
         pageKey: '/bar',
         posX: 0,
-        posY: 0
+        posY: 0,
       })
       const mockStore = configureMockStore()
       const store = mockStore({
         pages: {
-          '/foo': { componentIdentifier: 'about', restoreStrategy: 'fromCacheOnly' },
-          '/bar': { componentIdentifier: 'home', restoreStrategy: 'fromCacheOnly' },
+          '/foo': {
+            componentIdentifier: 'about',
+            restoreStrategy: 'fromCacheOnly',
+          },
+          '/bar': {
+            componentIdentifier: 'home',
+            restoreStrategy: 'fromCacheOnly',
+          },
         },
         superglue: {
-          csrfToken: "abc"
-        }
+          csrfToken: 'abc',
+        },
       })
-      const scrollTo = vi.spyOn(window, 'scrollTo').mockImplementation(() => {});
+      const scrollTo = vi.spyOn(window, 'scrollTo').mockImplementation(() => {})
       const component = mount(
         <Provider store={store}>
           <Nav
@@ -155,7 +169,7 @@ describe('Nav', () => {
             pathname: '/bar',
             search: '',
             hash: '',
-          }
+          },
         },
         {
           type: '@@superglue/HISTORY_CHANGE',
@@ -163,7 +177,7 @@ describe('Nav', () => {
             pathname: '/foo',
             search: '',
             hash: '',
-          }
+          },
         },
       ]
       expect(store.getActions()).toEqual(expectedActions)
@@ -171,7 +185,7 @@ describe('Nav', () => {
 
     it('navigates to the page when history changes', () => {
       const history = createMemoryHistory({})
-      history.push("/bar", {
+      history.push('/bar', {
         superglue: true,
         pageKey: '/bar',
         posX: 0,
@@ -180,12 +194,18 @@ describe('Nav', () => {
       const mockStore = configureMockStore()
       const store = mockStore({
         pages: {
-          '/bar': { componentIdentifier: 'home', restoreStrategy: 'fromCacheOnly' },
-          '/foo': { componentIdentifier: 'about', restoreStrategy: 'fromCacheOnly' },
+          '/bar': {
+            componentIdentifier: 'home',
+            restoreStrategy: 'fromCacheOnly',
+          },
+          '/foo': {
+            componentIdentifier: 'about',
+            restoreStrategy: 'fromCacheOnly',
+          },
         },
         superglue: {
-          csrfToken: "abc"
-        }
+          csrfToken: 'abc',
+        },
       })
 
       let mountTimes = 0
@@ -229,12 +249,18 @@ describe('Nav', () => {
       const mockStore = configureMockStore()
       const store = mockStore({
         pages: {
-          '/bar': { componentIdentifier: 'home', restoreStrategy: 'fromCacheOnly' },
-          '/foo': { componentIdentifier: 'about', restoreStrategy: 'fromCacheOnly' },
+          '/bar': {
+            componentIdentifier: 'home',
+            restoreStrategy: 'fromCacheOnly',
+          },
+          '/foo': {
+            componentIdentifier: 'about',
+            restoreStrategy: 'fromCacheOnly',
+          },
         },
         superglue: {
-          csrfToken: "abc"
-        }
+          csrfToken: 'abc',
+        },
       })
       const component = mount(
         <Nav
@@ -246,7 +272,7 @@ describe('Nav', () => {
       )
 
       expect(
-        component.instance().navigateTo('/blah', {action: 'none'})
+        component.instance().navigateTo('/blah', { action: 'none' })
       ).toEqual(false)
     })
   })
@@ -255,39 +281,47 @@ describe('Nav', () => {
     describe('when the previous page was set to "revisitOnly"', () => {
       it('revisits the page and scrolls when finished', () => {
         const history = createMemoryHistory({})
-        history.replace("/bar", {
+        history.replace('/bar', {
           superglue: true,
           pageKey: '/bar',
           posX: 5,
-          posY: 5
+          posY: 5,
         })
 
-        history.push("/foo", {
+        history.push('/foo', {
           superglue: true,
           pageKey: '/foo',
           posX: 10,
-          posY: 10
+          posY: 10,
         })
         const mockStore = configureMockStore()
         const store = mockStore({
           pages: {
-            '/bar': { componentIdentifier: 'home', restoreStrategy: 'revisitOnly' },
-            '/foo': { componentIdentifier: 'about', restoreStrategy: 'revisitOnly' },
+            '/bar': {
+              componentIdentifier: 'home',
+              restoreStrategy: 'revisitOnly',
+            },
+            '/foo': {
+              componentIdentifier: 'about',
+              restoreStrategy: 'revisitOnly',
+            },
           },
           superglue: {
-            csrfToken: "abc"
-          }
+            csrfToken: 'abc',
+          },
         })
-        const scrollTo = vi.spyOn(window, 'scrollTo').mockImplementation(() => {});
+        const scrollTo = vi
+          .spyOn(window, 'scrollTo')
+          .mockImplementation(() => {})
         const suggestedAction = 'none'
 
         const fakeVisit = vi.fn((...args) => {
           return {
-            then: vi.fn(fn => {
+            then: vi.fn((fn) => {
               expect(scrollTo).not.toHaveBeenCalled()
-              fn({suggestedAction})
+              fn({ suggestedAction })
               expect(scrollTo).toHaveBeenCalledWith(5, 5)
-            })
+            }),
           }
         })
 
@@ -304,44 +338,52 @@ describe('Nav', () => {
         )
 
         history.back()
-        expect(fakeVisit).toHaveBeenCalledWith("/bar", { revisit: true })
+        expect(fakeVisit).toHaveBeenCalledWith('/bar', { revisit: true })
       })
 
       it('revisits the page and skips scroll when redirected (suggestedAction is not "none")', () => {
         const history = createMemoryHistory({})
-        history.replace("/bar", {
+        history.replace('/bar', {
           superglue: true,
           pageKey: '/bar',
           posX: 5,
-          posY: 5
+          posY: 5,
         })
 
-        history.push("/foo", {
+        history.push('/foo', {
           superglue: true,
           pageKey: '/foo',
           posX: 10,
-          posY: 10
+          posY: 10,
         })
         const mockStore = configureMockStore()
         const store = mockStore({
           pages: {
-            '/bar': { componentIdentifier: 'home', restoreStrategy: 'revisitOnly' },
-            '/foo': { componentIdentifier: 'about', restoreStrategy: 'revisitOnly' },
+            '/bar': {
+              componentIdentifier: 'home',
+              restoreStrategy: 'revisitOnly',
+            },
+            '/foo': {
+              componentIdentifier: 'about',
+              restoreStrategy: 'revisitOnly',
+            },
           },
           superglue: {
-            csrfToken: "abc"
-          }
+            csrfToken: 'abc',
+          },
         })
-        const scrollTo = vi.spyOn(window, 'scrollTo').mockImplementation(() => {});
+        const scrollTo = vi
+          .spyOn(window, 'scrollTo')
+          .mockImplementation(() => {})
         const suggestedAction = 'push'
 
         const fakeVisit = vi.fn((...args) => {
           return {
-            then: vi.fn(fn => {
+            then: vi.fn((fn) => {
               // expect(scrollTo).not.toHaveBeenCalled()
-              fn({suggestedAction})
+              fn({ suggestedAction })
               expect(scrollTo).not.toHaveBeenCalled()
-            })
+            }),
           }
         })
 
@@ -360,37 +402,45 @@ describe('Nav', () => {
         )
 
         history.back()
-        expect(fakeVisit).toHaveBeenCalledWith("/bar", { revisit: true })
+        expect(fakeVisit).toHaveBeenCalledWith('/bar', { revisit: true })
       })
     })
 
     describe('when the previous page was set to "fromCacheOnly"', () => {
       it('restores without visiting and scrolls', () => {
         const history = createMemoryHistory({})
-        history.replace("/bar", {
+        history.replace('/bar', {
           superglue: true,
           pageKey: '/bar',
           posX: 5,
-          posY: 5
+          posY: 5,
         })
 
-        history.push("/foo", {
+        history.push('/foo', {
           superglue: true,
           pageKey: '/foo',
           posX: 10,
-          posY: 10
+          posY: 10,
         })
         const mockStore = configureMockStore()
         const store = mockStore({
           pages: {
-            '/bar': { componentIdentifier: 'home', restoreStrategy: 'fromCacheOnly' },
-            '/foo': { componentIdentifier: 'about', restoreStrategy: 'fromCacheOnly' },
+            '/bar': {
+              componentIdentifier: 'home',
+              restoreStrategy: 'fromCacheOnly',
+            },
+            '/foo': {
+              componentIdentifier: 'about',
+              restoreStrategy: 'fromCacheOnly',
+            },
           },
           superglue: {
-            csrfToken: "abc"
-          }
+            csrfToken: 'abc',
+          },
         })
-        const scrollTo = vi.spyOn(window, 'scrollTo').mockImplementation(() => {});
+        const scrollTo = vi
+          .spyOn(window, 'scrollTo')
+          .mockImplementation(() => {})
         const suggestedAction = 'none'
 
         const fakeVisit = vi.fn()
@@ -416,30 +466,38 @@ describe('Nav', () => {
     describe('and the previous page was set to "fromCacheAndRevisitInBackground"', () => {
       it('restores, scrolls, and revisits the page in the background', () => {
         const history = createMemoryHistory({})
-        history.replace("/bar", {
+        history.replace('/bar', {
           superglue: true,
           pageKey: '/bar',
           posX: 5,
-          posY: 5
+          posY: 5,
         })
 
-        history.push("/foo", {
+        history.push('/foo', {
           superglue: true,
           pageKey: '/foo',
           posX: 10,
-          posY: 10
+          posY: 10,
         })
         const mockStore = configureMockStore()
         const store = mockStore({
           pages: {
-            '/bar': { componentIdentifier: 'home', restoreStrategy: 'fromCacheAndRevisitInBackground' },
-            '/foo': { componentIdentifier: 'about', restoreStrategy: 'fromCacheAndRevisitInBackground' },
+            '/bar': {
+              componentIdentifier: 'home',
+              restoreStrategy: 'fromCacheAndRevisitInBackground',
+            },
+            '/foo': {
+              componentIdentifier: 'about',
+              restoreStrategy: 'fromCacheAndRevisitInBackground',
+            },
           },
           superglue: {
-            csrfToken: "abc"
-          }
+            csrfToken: 'abc',
+          },
         })
-        const scrollTo = vi.spyOn(window, 'scrollTo').mockImplementation(() => {});
+        const scrollTo = vi
+          .spyOn(window, 'scrollTo')
+          .mockImplementation(() => {})
         const suggestedAction = 'none'
 
         const fakeVisit = vi.fn((...args) => {
@@ -459,7 +517,7 @@ describe('Nav', () => {
         )
 
         history.back()
-        expect(fakeVisit).toHaveBeenCalledWith("/bar", { revisit: true })
+        expect(fakeVisit).toHaveBeenCalledWith('/bar', { revisit: true })
       })
     })
   })
diff --git a/superglue/spec/lib/action_creators.spec.js b/superglue/spec/lib/action_creators.spec.js
index 65ff1fc6..653579e9 100644
--- a/superglue/spec/lib/action_creators.spec.js
+++ b/superglue/spec/lib/action_creators.spec.js
@@ -1,4 +1,4 @@
-import {describe, expect, afterEach, it, vi} from 'vitest'
+import { describe, expect, afterEach, it, vi } from 'vitest'
 import configureMockStore from 'redux-mock-store'
 import { thunk } from 'redux-thunk'
 import fetchMock from 'fetch-mock'
@@ -116,11 +116,9 @@ describe('action creators', () => {
         },
       ]
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('handles deferments on the page and fires HANDLE_GRAFT', () => {
@@ -193,11 +191,9 @@ describe('action creators', () => {
         },
       })
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('handles nested deferments to complete the page before updating fragments', () => {
@@ -230,9 +226,7 @@ describe('action creators', () => {
           csrfToken: 'token',
           fragments: [],
           assets: [],
-          defers: [
-            { url: '/foo?props_at=data.body.aside.top', type: 'auto' },
-          ],
+          defers: [{ url: '/foo?props_at=data.body.aside.top', type: 'auto' }],
         }),
         headers: {
           'content-type': 'application/json',
@@ -273,7 +267,7 @@ describe('action creators', () => {
         {
           type: '@@superglue/BEFORE_REMOTE',
           payload: {
-            currentPageKey: "/bar",
+            currentPageKey: '/bar',
             fetchArgs: [
               '/foo?props_at=data.body&format=json',
               {
@@ -329,7 +323,7 @@ describe('action creators', () => {
         {
           type: '@@superglue/BEFORE_REMOTE',
           payload: {
-            currentPageKey: "/bar",
+            currentPageKey: '/bar',
             fetchArgs: [
               '/foo?props_at=data.body.aside.top&format=json',
               {
@@ -397,11 +391,9 @@ describe('action creators', () => {
         },
       ]
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('does not handle deferments when using SSR', () => {
@@ -432,12 +424,10 @@ describe('action creators', () => {
         },
       ]
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          global.fetch = prevFetch
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        global.fetch = prevFetch
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('handles deferments on the page and fires user defined success', () => {
@@ -516,11 +506,9 @@ describe('action creators', () => {
         },
       })
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('ignores manual deferments on the page', () => {
@@ -551,11 +539,9 @@ describe('action creators', () => {
         },
       ]
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('fires HANDLE_GRAFT and process a page', () => {
@@ -586,11 +572,9 @@ describe('action creators', () => {
         },
       ]
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('fires HANDLE_GRAFT, and process a page with a fragment', () => {
@@ -634,11 +618,9 @@ describe('action creators', () => {
         },
       ]
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     //TODO: add tests for when type is mannual
@@ -656,9 +638,7 @@ describe('action creators', () => {
         csrfToken: 'token',
         assets: [],
         fragments: [],
-        defers: [
-          { url: '/some_defered_request?props_at=body', type: 'auto' },
-        ],
+        defers: [{ url: '/some_defered_request?props_at=body', type: 'auto' }],
       }
 
       const expectedActions = [
@@ -694,11 +674,9 @@ describe('action creators', () => {
 
       fetchMock.mock('/some_defered_request?props_at=body&format=json', 500)
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('fires a user defined error when a fetch fails', () => {
@@ -756,11 +734,9 @@ describe('action creators', () => {
 
       fetchMock.mock('/some_defered_request?props_at=body&format=json', 500)
 
-      return store
-        .dispatch(saveAndProcessPage('/foo', page))
-        .then(() => {
-          expect(store.getActions()).toEqual(expectedActions)
-        })
+      return store.dispatch(saveAndProcessPage('/foo', page)).then(() => {
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
   })
 
@@ -783,7 +759,10 @@ describe('action creators', () => {
       const expectedActions = [
         {
           type: '@@superglue/BEFORE_REMOTE',
-          payload: { currentPageKey: "/bar", fetchArgs: ['/foo?format=json', expect.any(Object)] },
+          payload: {
+            currentPageKey: '/bar',
+            fetchArgs: ['/foo?format=json', expect.any(Object)],
+          },
         },
         {
           type: '@@superglue/BEFORE_FETCH',
@@ -804,21 +783,18 @@ describe('action creators', () => {
         },
       ]
 
-      return store
-        .dispatch(remote('/foo', { pageKey: '/foo' }))
-        .then(() => {
-          const requestheaders =
-            fetchMock.lastCall('/foo?format=json')[1].headers
-
-          expect(requestheaders).toEqual({
-            accept: 'application/json',
-            'x-requested-with': 'XMLHttpRequest',
-            'x-superglue-request': 'true',
-            'x-csrf-token': 'token',
-          })
+      return store.dispatch(remote('/foo', { pageKey: '/foo' })).then(() => {
+        const requestheaders = fetchMock.lastCall('/foo?format=json')[1].headers
 
-          expect(store.getActions()).toEqual(expectedActions)
+        expect(requestheaders).toEqual({
+          accept: 'application/json',
+          'x-requested-with': 'XMLHttpRequest',
+          'x-superglue-request': 'true',
+          'x-csrf-token': 'token',
         })
+
+        expect(store.getActions()).toEqual(expectedActions)
+      })
     })
 
     it('accepts a beforeSave to modify the response before saving', () => {
@@ -859,7 +835,10 @@ describe('action creators', () => {
       const expectedActions = [
         {
           type: '@@superglue/BEFORE_REMOTE',
-          payload: { currentPageKey: '/bar', fetchArgs: ['/foo?format=json', expect.any(Object)] },
+          payload: {
+            currentPageKey: '/bar',
+            fetchArgs: ['/foo?format=json', expect.any(Object)],
+          },
         },
         {
           type: '@@superglue/BEFORE_FETCH',
@@ -952,16 +931,15 @@ describe('action creators', () => {
         })
     })
 
-    it('removes format from params', () => new Promise(done => {
-      const store = mockStore(initialState())
+    it('removes format from params', () =>
+      new Promise((done) => {
+        const store = mockStore(initialState())
 
-      fetchMock.mock('/first?props_at=foo&format=json', rsp.visitSuccess())
-      store
-        .dispatch(remote('/first?props_at=foo'))
-        .then((meta) => {
+        fetchMock.mock('/first?props_at=foo&format=json', rsp.visitSuccess())
+        store.dispatch(remote('/first?props_at=foo')).then((meta) => {
           done()
         })
-    }))
+      }))
 
     it('returns a meta with redirected true if was redirected', () => {
       const store = mockStore(initialState())
@@ -976,11 +954,9 @@ describe('action creators', () => {
         body: successfulBody(),
       })
 
-      return store
-        .dispatch(remote('/redirecting_url'))
-        .then((meta) => {
-          expect(meta.redirected).toEqual(true)
-        })
+      return store.dispatch(remote('/redirecting_url')).then((meta) => {
+        expect(meta.redirected).toEqual(true)
+      })
     })
 
     it('fires SUPERGLUE_REQUEST_ERROR on a bad server response status', () => {
@@ -990,7 +966,10 @@ describe('action creators', () => {
       const expectedActions = [
         {
           type: '@@superglue/BEFORE_REMOTE',
-          payload: { currentPageKey: "/bar", fetchArgs: ['/foo?format=json', expect.any(Object)] },
+          payload: {
+            currentPageKey: '/bar',
+            fetchArgs: ['/foo?format=json', expect.any(Object)],
+          },
         },
         {
           type: '@@superglue/BEFORE_FETCH',
@@ -1024,7 +1003,10 @@ describe('action creators', () => {
       const expectedActions = [
         {
           type: '@@superglue/BEFORE_REMOTE',
-          payload: { currentPageKey: "/bar", fetchArgs: ['/foo?format=json', expect.any(Object)] },
+          payload: {
+            currentPageKey: '/bar',
+            fetchArgs: ['/foo?format=json', expect.any(Object)],
+          },
         },
         {
           type: '@@superglue/BEFORE_FETCH',
@@ -1063,7 +1045,10 @@ describe('action creators', () => {
       const expectedActions = [
         {
           type: '@@superglue/BEFORE_REMOTE',
-          payload: { currentPageKey: "/bar", fetchArgs: ['/foo?format=json', expect.any(Object)] },
+          payload: {
+            currentPageKey: '/bar',
+            fetchArgs: ['/foo?format=json', expect.any(Object)],
+          },
         },
         {
           type: '@@superglue/BEFORE_FETCH',
@@ -1089,54 +1074,55 @@ describe('action creators', () => {
       })
     })
 
-    it('fires SUPERGLUE_HANDLE_GRAFT when the response is a graft', () => new Promise(done => {
-      const store = mockStore({
-        ...initialState(),
-        pages: {
-          '/foo': {},
-        },
-      })
-      fetchMock.mock('/foo?format=json', {
-        body: JSON.stringify({
-          data: 'success',
-          action: 'graft',
-          path: 'heading.cart',
-          csrfToken: 'token',
-          assets: [],
-          fragments:[],
-          defers: [],
-        }),
-        headers: {
-          'content-type': 'application/json',
-        },
-      })
-
-      store.subscribe(() => {
-        const state = store.getState()
-        const actions = store.getActions()
-        const lastAction = actions[actions.length - 1]
-        const { type, payload } = lastAction
+    it('fires SUPERGLUE_HANDLE_GRAFT when the response is a graft', () =>
+      new Promise((done) => {
+        const store = mockStore({
+          ...initialState(),
+          pages: {
+            '/foo': {},
+          },
+        })
+        fetchMock.mock('/foo?format=json', {
+          body: JSON.stringify({
+            data: 'success',
+            action: 'graft',
+            path: 'heading.cart',
+            csrfToken: 'token',
+            assets: [],
+            fragments: [],
+            defers: [],
+          }),
+          headers: {
+            'content-type': 'application/json',
+          },
+        })
 
-        if (type === '@@superglue/HANDLE_GRAFT') {
-          expect(payload).toEqual({
-            pageKey: '/foo',
-            page: {
-              data: 'success',
-              action: 'graft',
-              path: 'heading.cart',
-              csrfToken: 'token',
-              assets: [],
-              fragments:[],
-              defers: [],
-            },
-          })
+        store.subscribe(() => {
+          const state = store.getState()
+          const actions = store.getActions()
+          const lastAction = actions[actions.length - 1]
+          const { type, payload } = lastAction
+
+          if (type === '@@superglue/HANDLE_GRAFT') {
+            expect(payload).toEqual({
+              pageKey: '/foo',
+              page: {
+                data: 'success',
+                action: 'graft',
+                path: 'heading.cart',
+                csrfToken: 'token',
+                assets: [],
+                fragments: [],
+                defers: [],
+              },
+            })
 
-          done()
-        }
-      })
+            done()
+          }
+        })
 
-      store.dispatch(remote('/foo', { pageKey: '/foo' }))
-    }))
+        store.dispatch(remote('/foo', { pageKey: '/foo' }))
+      }))
 
     it('warns if a received page has a completely component id that the target page it will replace', () => {
       vi.spyOn(console, 'warn')
@@ -1146,16 +1132,16 @@ describe('action creators', () => {
           csrfToken: 'token',
         },
         pages: {
-          "/bar": {
+          '/bar': {
             data: {},
-            componentIdentifier: "bar-id"
-          }
-        }
+            componentIdentifier: 'bar-id',
+          },
+        },
       })
 
       const successfulBody = {
         data: {},
-        componentIdentifier: "foo-id",
+        componentIdentifier: 'foo-id',
         csrfToken: 'token',
         assets: [],
         defers: [],
@@ -1169,10 +1155,8 @@ describe('action creators', () => {
         },
       })
 
-      return store
-        .dispatch(remote('/bar'))
-        .then(() => {
-          expect(console.warn).toHaveBeenCalledWith(
+      return store.dispatch(remote('/bar')).then(() => {
+        expect(console.warn).toHaveBeenCalledWith(
           `You're about replace an existing page located at pages["/bar"]
 that has the componentIdentifier "bar-id" with the contents of a
 received page that has a componentIdentifier of "foo-id".
@@ -1183,8 +1167,8 @@ navigate or change the current page component, your current page component may
 receive a shape that is unexpected and cause issues with rendering.
 
 Consider using data-sg-visit, the visit function, or redirect_back.`
-          )
-        })
+        )
+      })
     })
 
     it('does not warn if a received page is not replacing a target page with a different componentIdentifier', () => {
@@ -1195,16 +1179,16 @@ Consider using data-sg-visit, the visit function, or redirect_back.`
           csrfToken: 'token',
         },
         pages: {
-          "/bar": {
+          '/bar': {
             data: {},
-            componentIdentifier: "ForBar"
-          }
-        }
+            componentIdentifier: 'ForBar',
+          },
+        },
       })
 
       const successfulBody = {
         data: {},
-        componentIdentifier: "ForBar",
+        componentIdentifier: 'ForBar',
         csrfToken: 'token',
         assets: [],
         defers: [],
@@ -1218,11 +1202,9 @@ Consider using data-sg-visit, the visit function, or redirect_back.`
         },
       })
 
-      return store
-        .dispatch(remote('/bar'))
-        .then(() => {
-          expect(console.warn).not.toHaveBeenCalled()
-        })
+      return store.dispatch(remote('/bar')).then(() => {
+        expect(console.warn).not.toHaveBeenCalled()
+      })
     })
   })
 
@@ -1232,23 +1214,24 @@ Consider using data-sg-visit, the visit function, or redirect_back.`
       fetchMock.restore()
     })
 
-    it('removes formats json, and props_at params', () => new Promise(done => {
-      const initialState = {
-        pages: {},
-        superglue: {
-          assets: [],
-        },
-      }
+    it('removes formats json, and props_at params', () =>
+      new Promise((done) => {
+        const initialState = {
+          pages: {},
+          superglue: {
+            assets: [],
+          },
+        }
 
-      const store = mockStore(initialState)
+        const store = mockStore(initialState)
 
-      fetchMock.mock('/first?format=json', rsp.visitSuccess())
-      store
-        .dispatch(visit('/first?props_at=foo&format=json'))
-        .then((meta) => {
-          done()
-        })
-    }))
+        fetchMock.mock('/first?format=json', rsp.visitSuccess())
+        store
+          .dispatch(visit('/first?props_at=foo&format=json'))
+          .then((meta) => {
+            done()
+          })
+      }))
 
     describe('when initiated with a revisit indicator', () => {
       it('returns a meta with suggestedAction of "replace" if was redirected', () => {
@@ -1300,156 +1283,158 @@ Consider using data-sg-visit, the visit function, or redirect_back.`
       })
     })
 
+    it('gets aborted when a new visit starts', () =>
+      new Promise((done) => {
+        const initialState = {
+          pages: {},
+          superglue: {
+            assets: [],
+          },
+        }
 
-    it('gets aborted when a new visit starts', () => new Promise(done => {
-      const initialState = {
-        pages: {},
-        superglue: {
-          assets: [],
-        },
-      }
-
-      const store = mockStore(initialState)
+        const store = mockStore(initialState)
 
-      fetchMock.mock('/first?format=json', rsp.visitSuccess())
-      store.dispatch(visit('/first')).catch((err) => {
-        expect(err.message).toEqual('The operation was aborted.')
-        done()
-      })
-      store.dispatch(visit('/first'))
-    }))
+        fetchMock.mock('/first?format=json', rsp.visitSuccess())
+        store.dispatch(visit('/first')).catch((err) => {
+          expect(err.message).toEqual('The operation was aborted.')
+          done()
+        })
+        store.dispatch(visit('/first'))
+      }))
 
-    it('warns when a placeholder is passed but does not exist in state', () => new Promise(done => {
-      vi.spyOn(console, 'warn')
-      const initialState = {
-        superglue: {
-          assets: [],
-        },
-        pages: {},
-      }
+    it('warns when a placeholder is passed but does not exist in state', () =>
+      new Promise((done) => {
+        vi.spyOn(console, 'warn')
+        const initialState = {
+          superglue: {
+            assets: [],
+          },
+          pages: {},
+        }
 
-      const store = mockStore(initialState)
+        const store = mockStore(initialState)
 
-      fetchMock.mock('/first?format=json', rsp.visitSuccess())
+        fetchMock.mock('/first?format=json', rsp.visitSuccess())
 
-      const expectedFetchUrl = '/first?props_at=foo&format=json'
-      store
-        .dispatch(
-          visit(expectedFetchUrl, {
-            placeholderKey: '/does-not-exist',
-          })
-        )
-        .then((meta) => {
-          expect(console.warn).toHaveBeenCalledWith(
-            'Could not find placeholder with key /does-not-exist in state. The props_at param will be ignored'
+        const expectedFetchUrl = '/first?props_at=foo&format=json'
+        store
+          .dispatch(
+            visit(expectedFetchUrl, {
+              placeholderKey: '/does-not-exist',
+            })
           )
-          done()
-        })
-    }))
+          .then((meta) => {
+            expect(console.warn).toHaveBeenCalledWith(
+              'Could not find placeholder with key /does-not-exist in state. The props_at param will be ignored'
+            )
+            done()
+          })
+      }))
 
-    it('keeps the props_at parameter when a placeholder is passed and exists in state', () => new Promise(done => {
-      const initialState = {
-        superglue: {
-          assets: [],
-        },
-        pages: {
-          '/does-exist': {},
-        },
-      }
+    it('keeps the props_at parameter when a placeholder is passed and exists in state', () =>
+      new Promise((done) => {
+        const initialState = {
+          superglue: {
+            assets: [],
+          },
+          pages: {
+            '/does-exist': {},
+          },
+        }
 
-      const store = mockStore(initialState)
+        const store = mockStore(initialState)
 
-      fetchMock.mock('/first?props_at=foo&format=json', rsp.visitSuccess())
+        fetchMock.mock('/first?props_at=foo&format=json', rsp.visitSuccess())
 
-      const expectedFetchUrl = '/first?props_at=foo&format=json'
-      store
-        .dispatch(
-          visit(expectedFetchUrl, { placeholderKey: '/does-exist' })
-        )
-        .then((meta) => {
-          done()
-        })
-    }))
+        const expectedFetchUrl = '/first?props_at=foo&format=json'
+        store
+          .dispatch(visit(expectedFetchUrl, { placeholderKey: '/does-exist' }))
+          .then((meta) => {
+            done()
+          })
+      }))
 
-    it('warns when props_at is included but a placeholder was not passed', () => new Promise(done => {
-      vi.spyOn(console, 'warn')
-      const initialState = {
-        superglue: {
-          assets: [],
-        },
-        pages: {
-          '/does-exist': {},
-        },
-      }
+    it('warns when props_at is included but a placeholder was not passed', () =>
+      new Promise((done) => {
+        vi.spyOn(console, 'warn')
+        const initialState = {
+          superglue: {
+            assets: [],
+          },
+          pages: {
+            '/does-exist': {},
+          },
+        }
 
-      const store = mockStore(initialState)
+        const store = mockStore(initialState)
 
-      fetchMock.mock('/first?format=json', rsp.visitSuccess())
+        fetchMock.mock('/first?format=json', rsp.visitSuccess())
 
-      const expectedFetchUrl = '/first?props_at=foo'
-      store.dispatch(visit(expectedFetchUrl)).then((meta) => {
-        expect(console.warn).toHaveBeenCalledWith(
-          'visit was called with props_at param in the path /first?props_at=foo, this will be ignore unless you provide a placeholder.'
-        )
-        done()
-      })
-    }))
+        const expectedFetchUrl = '/first?props_at=foo'
+        store.dispatch(visit(expectedFetchUrl)).then((meta) => {
+          expect(console.warn).toHaveBeenCalledWith(
+            'visit was called with props_at param in the path /first?props_at=foo, this will be ignore unless you provide a placeholder.'
+          )
+          done()
+        })
+      }))
 
-    it('uses a placeholder when attempting to graft', () => new Promise(done => {
-      const initialState = {
-        superglue: {
-          assets: [],
-          currentPageKey: '/current',
-        },
-        pages: {
-          '/current': {
-            data: {
-              address: {},
+    it('uses a placeholder when attempting to graft', () =>
+      new Promise((done) => {
+        const initialState = {
+          superglue: {
+            assets: [],
+            currentPageKey: '/current',
+          },
+          pages: {
+            '/current': {
+              data: {
+                address: {},
+              },
+              csrfToken: 'token',
+              assets: ['application-new123.js', 'application-new123.js'],
+              fragments: [],
             },
-            csrfToken: 'token',
-            assets: [
-              'application-new123.js',
-              'application-new123.js',
-            ],
-            fragments: [],
           },
-        },
-      }
+        }
 
-      const store = mockStore(initialState)
+        const store = mockStore(initialState)
 
-      let mockResponse = rsp.graftSuccessWithNewZip()
-      fetchMock.mock('/details?props_at=data.address&format=json', mockResponse)
+        let mockResponse = rsp.graftSuccessWithNewZip()
+        fetchMock.mock(
+          '/details?props_at=data.address&format=json',
+          mockResponse
+        )
 
-      const expectedActions = [
-        {
-          type: '@@superglue/COPY_PAGE',
-          payload: { from: '/current', to: '/details' },
-        },
-        {
-          type: '@@superglue/BEFORE_VISIT',
-          payload: expect.any(Object),
-        },
-        {
-          type: '@@superglue/BEFORE_FETCH',
-          payload: expect.any(Object),
-        },
-        {
-          type: '@@superglue/HANDLE_GRAFT',
-          payload: expect.any(Object),
-        },
-      ]
+        const expectedActions = [
+          {
+            type: '@@superglue/COPY_PAGE',
+            payload: { from: '/current', to: '/details' },
+          },
+          {
+            type: '@@superglue/BEFORE_VISIT',
+            payload: expect.any(Object),
+          },
+          {
+            type: '@@superglue/BEFORE_FETCH',
+            payload: expect.any(Object),
+          },
+          {
+            type: '@@superglue/HANDLE_GRAFT',
+            payload: expect.any(Object),
+          },
+        ]
 
-      store
-        .dispatch(
-          visit('/details?props_at=data.address', {
-            placeholderKey: '/current',
+        store
+          .dispatch(
+            visit('/details?props_at=data.address', {
+              placeholderKey: '/current',
+            })
+          )
+          .then((meta) => {
+            expect(store.getActions()).toEqual(expectedActions)
+            done()
           })
-        )
-        .then((meta) => {
-          expect(store.getActions()).toEqual(expectedActions)
-          done()
-        })
-    }))
+      }))
   })
 })
diff --git a/superglue/spec/lib/middleware.spec.js b/superglue/spec/lib/middleware.spec.js
index 11b6e678..3a57ed2d 100644
--- a/superglue/spec/lib/middleware.spec.js
+++ b/superglue/spec/lib/middleware.spec.js
@@ -1,12 +1,7 @@
 import { describe, it, expect, vi } from 'vitest'
-import {
-  fragmentMiddleware,
-} from '../../lib/middleware'
+import { fragmentMiddleware } from '../../lib/middleware'
 import { getIn, setIn } from '../../lib/utils/immutability'
-import {
-  HISTORY_CHANGE,
-  UPDATE_FRAGMENTS
-} from '../../lib/actions'
+import { HISTORY_CHANGE, UPDATE_FRAGMENTS } from '../../lib/actions'
 
 describe('fragment middleware', () => {
   it('does nothing on superglue actions', () => {
@@ -14,10 +9,10 @@ describe('fragment middleware', () => {
       getState: () => {
         return {
           pages: {},
-          superglue: {}
+          superglue: {},
         }
       },
-      dispatch: vi.fn()
+      dispatch: vi.fn(),
     }
 
     const next = (action) => {
@@ -40,10 +35,10 @@ describe('fragment middleware', () => {
       getState: () => {
         return {
           pages,
-          superglue: {}
+          superglue: {},
         }
       },
-      dispatch: vi.fn()
+      dispatch: vi.fn(),
     }
 
     const action = {
@@ -64,23 +59,23 @@ describe('fragment middleware', () => {
       '/foo': {
         data: {
           header: {
-            email: "hello@hello.com"
+            email: 'hello@hello.com',
           },
         },
-        fragments: []
+        fragments: [],
       },
       '/bar': {
         data: {
           header: {
-            email: "hello@hello.com"
+            email: 'hello@hello.com',
           },
         },
-        fragments: []
-      }
+        fragments: [],
+      },
     }
 
     const changedNode = {
-      email: "world@world.com"
+      email: 'world@world.com',
     }
 
     const nextPages = setIn(pages, '/bar.data.header', changedNode)
@@ -89,16 +84,16 @@ describe('fragment middleware', () => {
       getState: () => {
         return {
           pages,
-          superglue: {}
+          superglue: {},
         }
       },
-      dispatch: vi.fn()
+      dispatch: vi.fn(),
     }
     const next = (action) => {
       store.getState = () => {
         return {
           pages: nextPages,
-          superglue: {}
+          superglue: {},
         }
       }
 
@@ -119,45 +114,41 @@ describe('fragment middleware', () => {
       '/foo': {
         data: {
           header: {
-            email: "hello@hello.com"
+            email: 'hello@hello.com',
           },
         },
-        fragments: [
-          {type: 'header', path: 'data.header'}
-        ]
+        fragments: [{ type: 'header', path: 'data.header' }],
       },
       '/bar': {
         data: {
           header: {
-            email: "hello@hello.com"
+            email: 'hello@hello.com',
           },
           body: {
-            title: "foobar"
-          }
+            title: 'foobar',
+          },
         },
-        fragments: [
-          {type: 'header', path: 'data.header'}
-        ]
-      }
+        fragments: [{ type: 'header', path: 'data.header' }],
+      },
     }
 
-    const nextPages = setIn(pages, '/bar.data.body', {title: "changed"})
+    const nextPages = setIn(pages, '/bar.data.body', { title: 'changed' })
 
     const store = {
       getState: () => {
         return {
           pages,
-          superglue: {}
+          superglue: {},
         }
       },
-      dispatch: vi.fn()
+      dispatch: vi.fn(),
     }
 
     const next = (action) => {
       store.getState = () => {
         return {
           pages: nextPages,
-          superglue: {}
+          superglue: {},
         }
       }
 
@@ -178,15 +169,13 @@ describe('fragment middleware', () => {
       '/foo': {
         data: {
           header: {
-            email: "hello@hello.com"
+            email: 'hello@hello.com',
           },
           body: {
-            title: "foobar"
-          }
+            title: 'foobar',
+          },
         },
-        fragments: [
-          {type: 'header', path: 'data.header'}
-        ]
+        fragments: [{ type: 'header', path: 'data.header' }],
       },
     }
 
@@ -197,17 +186,17 @@ describe('fragment middleware', () => {
       getState: () => {
         return {
           pages,
-          superglue: {}
+          superglue: {},
         }
       },
-      dispatch: vi.fn()
+      dispatch: vi.fn(),
     }
 
     const next = (action) => {
       store.getState = () => {
         return {
           pages: nextPages,
-          superglue: {}
+          superglue: {},
         }
       }
 
@@ -228,27 +217,23 @@ describe('fragment middleware', () => {
       '/foo': {
         data: {
           header: {
-            email: "hello@hello.com"
+            email: 'hello@hello.com',
           },
         },
-        fragments: [
-          {type: 'header', path: 'data.header'}
-        ]
+        fragments: [{ type: 'header', path: 'data.header' }],
       },
       '/bar': {
         data: {
           header: {
-            email: "hello@hello.com"
+            email: 'hello@hello.com',
           },
         },
-        fragments: [
-          {type: 'header', path: 'data.header'}
-        ]
-      }
+        fragments: [{ type: 'header', path: 'data.header' }],
+      },
     }
 
     const changedNode = {
-      email: "world@world.com"
+      email: 'world@world.com',
     }
 
     const nextPages = setIn(pages, '/bar.data.header', changedNode)
@@ -257,10 +242,10 @@ describe('fragment middleware', () => {
       getState: () => {
         return {
           pages,
-          superglue: {}
+          superglue: {},
         }
       },
-      dispatch: vi.fn()
+      dispatch: vi.fn(),
     }
     const next = (action) => {
       store.getState = () => {
@@ -277,18 +262,15 @@ describe('fragment middleware', () => {
     }
 
     fragmentMiddleware(store)(next)(action)
-    expect(store.dispatch).toHaveBeenCalledWith(
-      {
-        type: UPDATE_FRAGMENTS,
-        payload: {
-          changedFragments: {
-            header: {
-              email: "world@world.com"
-            }
-          }
-        }
-      }
-    )
+    expect(store.dispatch).toHaveBeenCalledWith({
+      type: UPDATE_FRAGMENTS,
+      payload: {
+        changedFragments: {
+          header: {
+            email: 'world@world.com',
+          },
+        },
+      },
+    })
   })
 })
-
diff --git a/superglue/spec/lib/reducers.spec.js b/superglue/spec/lib/reducers.spec.js
index 8f0a3f21..2f20aab3 100644
--- a/superglue/spec/lib/reducers.spec.js
+++ b/superglue/spec/lib/reducers.spec.js
@@ -1,4 +1,4 @@
-import {describe, expect, it, vi} from 'vitest'
+import { describe, expect, it, vi } from 'vitest'
 import {
   pageReducer,
   superglueReducer,
@@ -390,7 +390,7 @@ describe('reducers', () => {
             assets: ['application-123.js'],
             pageKey: '/foo',
             fragments: [],
-            savedAt: expect.any(Number)
+            savedAt: expect.any(Number),
           })
         )
       })
@@ -451,9 +451,7 @@ describe('reducers', () => {
               bar: {},
             },
           },
-          defers: [
-            { url: '/foo?props_at=data.foo.bar', path: 'data.foo.bar' },
-          ],
+          defers: [{ url: '/foo?props_at=data.foo.bar', path: 'data.foo.bar' }],
           fragments: [],
         }
 
@@ -475,9 +473,7 @@ describe('reducers', () => {
             },
           },
           pageKey: '/foo',
-          defers: [
-            { url: '/foo?props_at=data.foo.bar', path: 'data.foo.bar' },
-          ],
+          defers: [{ url: '/foo?props_at=data.foo.bar', path: 'data.foo.bar' }],
           fragments: [],
           savedAt: expect.any(Number),
         })
@@ -510,12 +506,8 @@ describe('reducers', () => {
             },
             baz: 'received',
           },
-          defers: [
-            { url: '/bar?props_at=data.foo.bar', path: 'data.foo.bar' },
-          ],
-          fragments: [
-            { type: 'info', partial: 'info', path: 'data.foo.bar' },
-          ],
+          defers: [{ url: '/bar?props_at=data.foo.bar', path: 'data.foo.bar' }],
+          fragments: [{ type: 'info', partial: 'info', path: 'data.foo.bar' }],
         }
 
         const nextState = pageReducer(prevState, {
@@ -536,12 +528,8 @@ describe('reducers', () => {
             baz: 'received',
           },
           pageKey: '/bar',
-          defers: [
-            { url: '/bar?props_at=data.foo.bar', path: 'data.foo.bar' },
-          ],
-          fragments: [
-            { type: 'info', partial: 'info', path: 'data.foo.bar' },
-          ],
+          defers: [{ url: '/bar?props_at=data.foo.bar', path: 'data.foo.bar' }],
+          fragments: [{ type: 'info', partial: 'info', path: 'data.foo.bar' }],
           savedAt: expect.any(Number),
         })
       })
@@ -570,12 +558,8 @@ describe('reducers', () => {
               bar: {},
             },
           },
-          defers: [
-            { url: '/foo?props_at=data.foo.bar', path: 'data.foo.bar' },
-          ],
-          fragments: [
-            { type: 'info', partial: 'info', path: 'data.foo.bar' },
-          ],
+          defers: [{ url: '/foo?props_at=data.foo.bar', path: 'data.foo.bar' }],
+          fragments: [{ type: 'info', partial: 'info', path: 'data.foo.bar' }],
         }
 
         const nextState = pageReducer(prevState, {
@@ -593,12 +577,8 @@ describe('reducers', () => {
             },
           },
           pageKey: '/foo',
-          defers: [
-            { url: '/foo?props_at=data.foo.bar', path: 'data.foo.bar' },
-          ],
-          fragments: [
-            { type: 'info', partial: 'info', path: 'data.foo.bar' },
-          ],
+          defers: [{ url: '/foo?props_at=data.foo.bar', path: 'data.foo.bar' }],
+          fragments: [{ type: 'info', partial: 'info', path: 'data.foo.bar' }],
           savedAt: expect.any(Number),
         })
       })
@@ -630,9 +610,9 @@ describe('reducers', () => {
           payload: {
             changedFragments: {
               header: {
-                email: "world@world.com"
-              }
-            }
+                email: 'world@world.com',
+              },
+            },
           },
         })
 
@@ -652,13 +632,13 @@ describe('reducers', () => {
               },
             },
             fragments: [{ type: 'header', path: 'data.header' }],
-          }
+          },
         })
       })
 
       it('skips updating referentially identical fragments', () => {
         const header = {
-          email: "world@world.com"
+          email: 'world@world.com',
         }
 
         const prevState = {
@@ -682,8 +662,8 @@ describe('reducers', () => {
           type: '@@superglue/UPDATE_FRAGMENTS',
           payload: {
             changedFragments: {
-              header
-            }
+              header,
+            },
           },
         })
 
@@ -703,7 +683,7 @@ describe('reducers', () => {
               },
             },
             fragments: [{ type: 'header', path: 'data.header' }],
-          }
+          },
         })
 
         expect(nextState['/foo'].data.header).toBe(header)
diff --git a/superglue/spec/lib/utils/immutability.spec.js b/superglue/spec/lib/utils/immutability.spec.js
index 9a6c7f48..ec35b33b 100644
--- a/superglue/spec/lib/utils/immutability.spec.js
+++ b/superglue/spec/lib/utils/immutability.spec.js
@@ -98,18 +98,18 @@ describe('setIn', () => {
   })
 
   it('sets if the key on the object does not exist', () => {
-    const page = { a: { b: {hello: "world"} } }
+    const page = { a: { b: { hello: 'world' } } }
     const clone = setIn(page, 'a.c', 'foo')
 
     expect(page.a.b).toBe(clone.a.b)
-    expect(clone).toEqual({ a: { b: {hello: "world"} , c: 'foo' }})
+    expect(clone).toEqual({ a: { b: { hello: 'world' }, c: 'foo' } })
   })
 
   it('sets if the index on the array does not exist', () => {
-    const page = { a: [{c: 4}, {b: 5}] }
+    const page = { a: [{ c: 4 }, { b: 5 }] }
     const clone = setIn(page, 'a.0', 'foo')
 
     expect(page.a[1]).toBe(clone.a[1])
-    expect(clone).toEqual({ a: ['foo', {b: 5}]})
+    expect(clone).toEqual({ a: ['foo', { b: 5 }] })
   })
 })
diff --git a/superglue/spec/lib/utils/request.spec.js b/superglue/spec/lib/utils/request.spec.js
index 2f49bdd6..104c4019 100644
--- a/superglue/spec/lib/utils/request.spec.js
+++ b/superglue/spec/lib/utils/request.spec.js
@@ -1,5 +1,9 @@
 import { describe, it, expect, beforeAll, afterAll, vi } from 'vitest'
-import { isValidResponse, argsForFetch, handleServerErrors } from '../../../lib/utils/request'
+import {
+  isValidResponse,
+  argsForFetch,
+  handleServerErrors,
+} from '../../../lib/utils/request'
 import parse from 'url-parse'
 import Headers from 'fetch-headers'
 
@@ -76,7 +80,7 @@ describe('argsForFetch', () => {
       }
     }
 
-    const { signal } = new AbortController
+    const { signal } = new AbortController()
 
     const args = argsForFetch(getState, '/foo', { signal })
 
@@ -95,7 +99,6 @@ describe('argsForFetch', () => {
     ])
   })
 
-
   it('returns fetch arguments with content-type json and method POST on non-GETs', () => {
     const getState = () => {
       return {
@@ -173,7 +176,10 @@ describe('argsForFetch', () => {
       },
     ])
 
-    const args2 = argsForFetch(getState, '/foo', { method: 'HEAD', body: 'ignored' })
+    const args2 = argsForFetch(getState, '/foo', {
+      method: 'HEAD',
+      body: 'ignored',
+    })
 
     expect(args2).toEqual([
       '/foo?format=json',
@@ -192,21 +198,19 @@ describe('argsForFetch', () => {
 })
 
 describe('handleServerErrors', () => {
-  let originalConsoleError;
+  let originalConsoleError
 
   beforeAll(() => {
-    originalConsoleError = console.error;
-    console.error = vi.fn();
-  });
+    originalConsoleError = console.error
+    console.error = vi.fn()
+  })
 
   afterAll(() => {
-    console.error = originalConsoleError;
-  });
+    console.error = originalConsoleError
+  })
 
   it('warns when 406 response code is received', () => {
-    const headers = new Headers([
-      ['content-type', 'application/json'],
-    ])
+    const headers = new Headers([['content-type', 'application/json']])
 
     const rsp = {
       ok: false,
@@ -215,21 +219,19 @@ describe('handleServerErrors', () => {
       headers,
     }
 
-    expect(() => handleServerErrors({ rsp })).toThrowError('Not Acceptable');
+    expect(() => handleServerErrors({ rsp })).toThrowError('Not Acceptable')
     expect(console.error).toHaveBeenCalledWith(
-        "Superglue encountered a 406 Not Acceptable response. This can happen if you used respond_to and didn't specify format.json in the block. Try adding it to your respond_to. For example:\n\n" +
+      "Superglue encountered a 406 Not Acceptable response. This can happen if you used respond_to and didn't specify format.json in the block. Try adding it to your respond_to. For example:\n\n" +
         'respond_to do |format|\n' +
         '  format.html\n' +
         '  format.json\n' +
         '  format.csv\n' +
         'end'
-    );
-  });
+    )
+  })
 
   it('throws error for non-406 response codes', () => {
-    const headers = new Headers([
-      ['content-type', 'application/json'],
-    ])
+    const headers = new Headers([['content-type', 'application/json']])
 
     const rsp = {
       ok: false,
@@ -238,13 +240,13 @@ describe('handleServerErrors', () => {
       headers,
     }
 
-    expect(() => handleServerErrors({ rsp })).toThrowError('Internal Server Error');
-  });
+    expect(() => handleServerErrors({ rsp })).toThrowError(
+      'Internal Server Error'
+    )
+  })
 
   it('does not throw error for ok response', () => {
-    const headers = new Headers([
-      ['content-type', 'application/json'],
-    ])
+    const headers = new Headers([['content-type', 'application/json']])
 
     const rsp = {
       ok: true,
@@ -253,6 +255,6 @@ describe('handleServerErrors', () => {
       headers,
     }
 
-    expect(() => handleServerErrors({ rsp })).not.toThrow();
-  });
-});
+    expect(() => handleServerErrors({ rsp })).not.toThrow()
+  })
+})
diff --git a/superglue/spec/lib/utils/ujs.spec.js b/superglue/spec/lib/utils/ujs.spec.js
index 32637dfb..5b330cf5 100644
--- a/superglue/spec/lib/utils/ujs.spec.js
+++ b/superglue/spec/lib/utils/ujs.spec.js
@@ -12,7 +12,7 @@ describe('ujs', () => {
   function createFakeLinkTarget(attrs = {}) {
     const jsdom = new JSDOM('<!doctype html><html><body></body></html>', {
       url: 'http://localhost/',
-    });
+    })
     global.Element = jsdom.window.Element
     const { document } = jsdom.window
 
@@ -226,7 +226,7 @@ describe('ujs', () => {
     function createFakeFormTarget(attrs = {}) {
       const jsdom = new JSDOM('<!doctype html><html><body></body></html>', {
         url: 'http://localhost/',
-      });
+      })
       global.HTMLFormElement = jsdom.window.HTMLFormElement
       const { document } = jsdom.window
 
diff --git a/superglue/spec/support/jasmine.json b/superglue/spec/support/jasmine.json
index b1ca1ad2..abf4a6d4 100644
--- a/superglue/spec/support/jasmine.json
+++ b/superglue/spec/support/jasmine.json
@@ -1,13 +1,7 @@
 {
   "spec_dir": "spec",
-  "spec_files": [
-    "**/*[sS]pec.js",
-    "../lib/**/*[sS]pec.js"
-  ],
-  "helpers": [
-    "../node_modules/babel-register/lib/node.js",
-    "helpers/**/*.js"
-  ],
+  "spec_files": ["**/*[sS]pec.js", "../lib/**/*[sS]pec.js"],
+  "helpers": ["../node_modules/babel-register/lib/node.js", "helpers/**/*.js"],
   "stopSpecOnExpectationFailure": false,
   "random": false
 }
diff --git a/superglue/tsconfig.json b/superglue/tsconfig.json
index 1be1b62c..d72f74c4 100644
--- a/superglue/tsconfig.json
+++ b/superglue/tsconfig.json
@@ -8,9 +8,8 @@
     "allowJs": false,
     "target": "ES2021",
     "allowSyntheticDefaultImports": true,
-    "esModuleInterop": true
+    "esModuleInterop": true,
+    "noEmit": true
   },
-  "include": [
-    "./lib/**/*"
-  ]
+  "include": ["./lib/**/*"]
 }
diff --git a/superglue/tsup.config.ts b/superglue/tsup.config.ts
new file mode 100644
index 00000000..27be6338
--- /dev/null
+++ b/superglue/tsup.config.ts
@@ -0,0 +1,29 @@
+import type { Options } from 'tsup'
+import { defineConfig } from 'tsup'
+
+export default defineConfig((options) => {
+  const commonOptions: Partial<Options> = {
+    entry: {
+      superglue: 'lib/index.tsx',
+      action_creators: 'lib/action_creators/index.ts',
+    },
+    sourcemap: true,
+    ...options,
+  }
+
+  return [
+    {
+      ...commonOptions,
+      format: ['esm'],
+      outExtension: () => ({ js: '.mjs' }), // Add dts: '.d.ts' when egoist/tsup#1053 lands
+      dts: true,
+      clean: true,
+    },
+    {
+      ...commonOptions,
+      format: 'cjs',
+      outDir: './dist/cjs/',
+      outExtension: () => ({ js: '.cjs' }),
+    },
+  ]
+})
diff --git a/superglue_rails/test/acceptance/superglue_installation_acceptance.rb b/superglue_rails/test/acceptance/superglue_installation_acceptance.rb
index 8be19c22..6b27b385 100644
--- a/superglue_rails/test/acceptance/superglue_installation_acceptance.rb
+++ b/superglue_rails/test/acceptance/superglue_installation_acceptance.rb
@@ -63,7 +63,7 @@ def install_superglue
     Dir.chdir(SUPERGLUE_SUPERGLUE_PATH) do
       successfully "npm install"
       successfully "npm run build"
-      successfully "npm pack ./dist"
+      successfully "npm pack"
     end
     successfully "echo \"gem 'props_template'\" >> Gemfile"
     successfully "echo \"gem 'superglue', path: '#{SUPERGLUE_RAILS_PATH}'\" >> Gemfile"