SDK Installation
The Break Ground SDK is loaded via a script tag. It is not available as an npm package.
Embed Snippet
Add the following snippet inside the head section of your HTML, before any other application scripts:
<!-- DAP SDK Snippet -->
<script>
(function (w, d, s, o, f, js, fjs) {
w["DAPObject"] = f;
w[f] =
w[f] ||
function () {
(w[f].q = w[f].q || []).push(arguments);
};
w[f].l = 1 * new Date();
js = d.createElement(s);
fjs = d.getElementsByTagName(s)[0];
js.id = f;
js.src = o;
js.async = 1;
js.crossOrigin = "anonymous";
fjs.parentNode.insertBefore(js, fjs);
})(window, document, "script", "https://cdn.example.com/sdk.js", "DAP");
DAP("init", { tenantKey: "YOUR_TENANT_KEY" });
</script>
Replace YOUR_TENANT_KEY with the API key from your dashboard (Settings > API Keys).
Snippet Breakdown
| Part | Purpose |
| ------------------------------------- | ---------------------------------------------------------------------------------------- | -------------- | --------------------------------------------------------------------------------- |
| w['DAPObject']=f | Registers the global function name (DAP) so the SDK knows which name to bind to. |
| w[f]=w[f] | | function()... | Creates a stub DAP function that queues calls made before the SDK script loads. |
| w[f].l=1*new Date() | Records a timestamp used to measure SDK load time. |
| js=d.createElement(s) | Creates a new script element for the SDK bundle. |
| js.async=1 | Ensures the script loads asynchronously without blocking page rendering. |
| js.crossOrigin='anonymous' | Enables CORS for the script so browser error reporting includes full stack traces. |
| fjs.parentNode.insertBefore(js,fjs) | Inserts the SDK script before the first existing script tag in the page. |
| DAP('init', { tenantKey: '...' }) | Initializes the SDK. This call is queued and processed once the script finishes loading. |
Placement
Place the snippet in the head section of your HTML. This ensures the SDK begins loading as early as possible and can queue commands before the page fully renders. The async flag prevents it from blocking your page load.
Verifying the Installation
After adding the snippet, confirm the SDK loaded:
- Open your application in a browser.
- Open the developer console (
F12orCmd+Option+I). - Type
window.DAPand press Enter. You should see the DAP function object. - To see detailed initialization logs, enable debug mode:
DAP("init", { tenantKey: "YOUR_TENANT_KEY", debug: true });
- Check the Console tab for messages prefixed with
[DAP]confirming successful initialization.
If window.DAP is undefined, verify the snippet is present in your page source and that no Content Security Policy (CSP) rules are blocking the SDK script.
Framework-Specific Guides
For step-by-step instructions on installing the SDK in a specific framework: