> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cadanapay.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Updating the Widget

> How calculator updates reach your site, and what to do when they don't

We ship fixes and improvements to the calculator continuously. The widget URL is stable — there is no version number in it — so `salary.js` always serves the current build.

Whether your site picks up a new build automatically depends on **how you embedded it**.

***

## Two integration modes

| How you embedded                                      | Updates reach you                    |
| :---------------------------------------------------- | :----------------------------------- |
| Script tag pointing at `widgets.cadanapay.com`        | Automatically, on the next page load |
| Bundled into your build (Framer, Webflow, npm import) | Only when you rebuild and redeploy   |

### Script tag — updates are automatic

If your page loads the widget at runtime:

```html HTML theme={null}
<script async src="https://widgets.cadanapay.com/calculators/salary.js?key=YOUR_PUBLIC_API_KEY"></script>
```

the browser fetches the current build every time the page loads. You get updates without doing anything. See [Forcing an update](#forcing-an-update) if a cached copy is being served instead.

### Bundled — you must redeploy

Some site builders and bundlers copy the widget into your own build output instead of fetching it at runtime. Framer does this, as do npm-based bundlers when you import the module. Your build then serves its own snapshot from your domain, usually under a content-hashed filename such as `salary.a1b2c3.mjs`.

That snapshot never changes on its own. **Rebuild and redeploy to pick up a new version** — and remember to do it for every environment, including staging and demo sites.

***

## Which mode am I in?

Open your browser's developer tools, go to the **Network** tab, reload the page, and find the calculator script.

| Request URL                                            | Mode                               |
| :----------------------------------------------------- | :--------------------------------- |
| `widgets.cadanapay.com/calculators/salary.js`          | Script tag — updates automatically |
| Your own domain, hashed filename (`salary.a1b2c3.mjs`) | Bundled — redeploy to update       |

***

## Which build am I running?

Check the `last-modified` response header on the calculator script in the same Network tab. It tells you when the build you are running was published.

If it predates a fix you are expecting, you are on an older copy — either cached in your browser, or baked into your last deploy.

***

## Forcing an update

<Steps>
  <Step title="Reload without the cache">
    A hard reload (`Cmd`/`Ctrl` + `Shift` + `R`) makes your browser re-fetch the script. Enough to confirm what the current build does, but it only affects the machine you are sitting at.
  </Step>

  <Step title="Add a version parameter for your visitors">
    A hard reload cannot clear your visitors' caches. To push an update to everyone at once, change the URL by adding any parameter you control:

    ```html HTML theme={null}
    <script async src="https://widgets.cadanapay.com/calculators/salary.js?key=YOUR_PUBLIC_API_KEY&v=2026-08-27"></script>
    ```

    Browsers treat this as a new URL and fetch it fresh. Bump the value whenever you want to guarantee everyone is on the latest build. The widget reads its key from the query string, so extra parameters are safe to add.
  </Step>
</Steps>

***

## Testing an update before it goes live

Point a staging page at the staging widget to try a build against your own integration first:

```html HTML theme={null}
<script async src="https://dev-widgets.cadanapay.com/calculators/salary.js?key=YOUR_PUBLIC_API_KEY"></script>
```

Staging keys and domain whitelists are separate from production — see [Getting Started](/tools/calculator/getting-started) for both widget URLs.

<Tip>
  If you bundle the widget, pin your staging and production deploys to the same build before comparing them. Otherwise you may be looking at two different versions without realising it.
</Tip>

***

## What stays stable

Updates are meant to be drop-in. The embed snippet, the [configuration options](/tools/calculator/configuration), the [CSS variables](/tools/calculator/theming), and the [events](/tools/calculator/events) are all part of the widget's public surface, and we avoid breaking them.
