### Install Sample App Dependencies

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/javascript-sdk/README.md

Install the necessary dependencies for the sample applications. Run this command in the root folder of the cloned sample apps repository.

```bash
npm install
```

--------------------------------

### Install ForgeRock JavaScript SDK

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/README.md

Install the SDK using npm. This command fetches and installs the latest version of the SDK package.

```bash
npm install @forgerock/javascript-sdk
```

--------------------------------

### Run Embedded Login Sample App

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/javascript-sdk/README.md

Start the embedded login sample application. This command is used after configuring the .env file for the embedded login sample.

```bash
npm run start:embedded-login
```

--------------------------------

### Install Ping Protect Module

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

Install the ForgeRock JavaScript SDK and the Ping Protect module using npm or pnpm.

```sh
npm install @forgerock/javascript-sdk @forgerock/ping-protect
```

```sh
pnpm add @forgerock/javascript-sdk @forgerock/ping-protect
```

--------------------------------

### Initialize Token Vault Client

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Initializes the Token Vault client by configuring the application, interceptor, and proxy origins and file paths. This setup should be in your app's main file.

```javascript
// app/src/main.js
import { Config, TokenManager } from '@forgerock/javascript-sdk';
import { client } from '@forgerock/token-vault';

/**
 * This factory function takes in a config object and returns
 * the necessary methods to setup the iframe ("proxy"), the
 * service worker ("interceptor"), and the token store replacement
 * API	("store").
 */
const register = client({
  app: {
    origin: 'http://localhost:5173',
  },
  interceptor: {
    file: '/interceptor.js',
  },
  proxy: {
    origin: 'http://localhost:5175',
  },
});

/**
 * Sets up the service worker for intercepting fetch requests
 */
register.interceptor({
  /* optional interceptor worker config */
});

/**
 * Injects the iframe into the DOM to setup the proxy
 * Make sure to pass in the required, real DOM element as the zeroeth argument
 */
register.proxy(document.getElementById('token-vault'), {
  /* optional proxy config */
});

/**
 * Creates the store replacement for the SDK
 */
const tokenVaultStore = register.store({
  /* optional store config */
});
```

--------------------------------

### Example Redacted Token Response

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

An example of the redacted token response structure returned by the SDK. Sensitive token values are masked for security.

```json
{
  "accessToken": "REDACTED",
  "idToken": "eyJ0eXAiOiJKV1QiLCJra…7r8soMCk8A7QdQpg",
  "refreshToken": "REDACTED",
  "tokenExpiry": 1690712227226
}
```

--------------------------------

### Get Tokens with TokenManager

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Retrieve access and refresh tokens using the TokenManager. Note that token values will be redacted in the console output for security.

```javascript
import { TokenManager } from '@forgerock/javascript-sdk';

const tokens = TokenManager.getTokens();

console.log(tokens); // Refresh & Access Token values will be redacted
```

--------------------------------

### Get Ping Protect Data for Evaluation

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

When a PingOneProtectEvaluationCallback is encountered, call PIProtect.getData() to package collected data for server evaluation. This is an asynchronous call and requires error handling.

```javascript
import { PIProtect } from '@forgerock/ping-protect';

let data;

if (step.getCallbacksOfType('PingOneProtectEvaluationCallback')) {
  try {
    // Asynchronous call
    data = await PIProtect.getData();
  } catch (err) {
    // handle error
  }
}
```

--------------------------------

### Build the Project

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

Build the project to ensure it is set up correctly and all dependencies are resolved.

```bash
pnpm build
```

--------------------------------

### Navigate to Project Directory

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

Change the current directory to the cloned project folder.

```bash
cd forgerock-javascript-sdk
```

--------------------------------

### Clone Sample Apps Repository

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/javascript-sdk/README.md

Clone the sample applications repository to explore and test SDK functionality. This is a prerequisite for running the sample apps.

```bash
git clone https://github.com/ForgeRock/sdk-sample-apps.git
```

--------------------------------

### Run Nx Commands

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

Execute various commands like build, lint, or test for specific projects using Nx. Replace `<name in project.json>` with the actual project name.

```bash
`pnpm nx build javascript-sdk`
```

```bash
`pnpm nx lint javascript-sdk`
```

```bash
`pnpm nx test javascript-sdk`
```

```bash
`pnpm nx e2e autoscript-suites`
```

```bash
`pnpm nx serve autoscript-apps`
```

--------------------------------

### Version packages for beta release

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/contributing_docs/releases.md

Use this command to version packages specifically for a beta release. The --snapshot beta flag ensures packages are versioned as betas.

```bash
pnpm changeset version --snapshot beta
```

--------------------------------

### Publish Beta Package Manually

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/contributing_docs/releases.md

Use this command to publish a beta version of your package. Ensure you use the --tag beta flag and --no-git-checks to avoid pipeline issues. Publishing manually first prevents the package from being published as the default private.

```bash
pnpm publish <package-name> --tag beta --no-git-checks --access public
```

--------------------------------

### Continue Journey After Initialization

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

After initializing Ping Protect, call FRAuth.next(step) to proceed with the user's journey.

```javascript
FRAuth.next(step);
```

--------------------------------

### Clone the Repository

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

Clone your forked repository to your local machine using the provided Git command.

```bash
git clone https://github.com/your-username/forgerock-javascript-sdk.git
```

--------------------------------

### Initialize Ping Protect Early

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

Call PIProtect.start() early in your application startup to collect as much data as possible for higher accuracy. The envId is a required configuration.

```javascript
import { PIProtect } from '@forgerock/ping-protect';

// Call early in your application startup
PIProtect.start({ envId: '02fb1243-189a-4bc7-9d6c-a919edf6447' });
```

--------------------------------

### PingOneProtectInitializeCallback Methods

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

Available methods for the PingOneProtectInitializeCallback, including retrieving configuration and setting client errors.

```javascript
callback.getConfig();
callback.setClientError();
```

--------------------------------

### Add a Changeset

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

Use the 'pnpm changeset' command to add a changeset when a change requires a release. Follow the interactive prompts to fill out the necessary information.

```bash
pnpm changeset
```

--------------------------------

### Dry run beta package publish

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/contributing_docs/releases.md

Perform a dry run of publishing a package with the beta tag to verify the publish configuration and access level. The --access public flag is crucial for new packages.

```bash
pnpm publish <package-name> --tag beta --no-git-checks --access public --dry-run
```

--------------------------------

### Test package publish with Verdaccio

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/contributing_docs/releases.md

Commands to test publishing a package to a local private npm registry using Verdaccio. Ensure your .npmrc is updated to point to the local registry.

```bash
pnpm nx run local-registry
```

```bash
pnpm changeset version
pnpm publish packages/{your_package} --dry-run --no-git-checks --registry=http://localhost:4873
```

--------------------------------

### Conventional Commit Structure

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

Follow this structure for commit messages to ensure consistency and clarity.

```text
<type>(<scope>): <short summary>
<BLANK LINE>
<body>
<BLANK LINE>
<footer>
```

--------------------------------

### Push Changes to Fork

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

After committing, push your changes to your forked repository.

```bash
git push origin feature/my-new-feature
```

--------------------------------

### Configure Forgerock SDK with Token Vault Store

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Configures the Forgerock SDK with essential parameters and replaces the default token store with the Token Vault's custom store. This should be in your app's main file.

```javascript
// app/src/main.js
// ...
// Configuring the SDK (values should be your own)
Config.set({
  clientId: 'WebOAuthClient',
  redirectUri: location.href,
  scope: 'openid email profile',
  serverConfig: {
    baseUrl: 'https//auth.example.com/am/',
    timeout: 5000,
  },
  realmPath: 'alpha',
  // Replace the default token store with Token Vault's store
  tokenStore: tokenVaultStore,
});
```

--------------------------------

### Configure Token Vault Interceptor

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Sets up the Token Vault interceptor. This is typically used in a separate bundle for cross-browser compatibility.

```javascript
import { interceptor } from '@forgerock/token-vault';

interceptor({
  /* config */
});
```

--------------------------------

### Handle Initialization Errors

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

In case of an error during Ping Protect initialization, use setClientError() on the callback to send the error message to the server via FRAuth.next().

```javascript
if (step.getCallbacksOfType('PingOneProtectInitializeCallback')) {
  const callback = step.getCallbackOfType('PingOneProtectInitializeCallback');
  try {
    // Asynchronous call
    await PIProtect.start({ envId: '02fb1243-189a-4bc7-9d6c-a919edf6447' });
  } catch (err) {
    callback.setClientError(err.message);
  }
}
```

--------------------------------

### Configure Token Vault Proxy

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Initializes the Token Vault proxy, which is served from a different origin and often runs in an iframe.

```javascript
import { proxy } from '@forgerock/token-vault';

proxy({
  /* config */
});
```

--------------------------------

### Commit Changes with Signed Messages

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

Commit your changes with a clear message following Conventional Commit conventions. Ensure all commits are signed.

```bash
git commit -S -m "feat: add login functionality"
```

--------------------------------

### PIProtect Class Methods

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

Overview of available methods on the PIProtect class for managing behavioral data collection.

```javascript
PIProtect.start();
PIProtect.getData();
PIProtect.pauseBehavioralData();
PIProtect.resumeBehavioralData();
```

--------------------------------

### Conventional Commit Format

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/contributing_docs/git.md

Use this format for all commits to the repository. Ensure a blank line separates the header from the body and footer.

```bash
    <type>(<scope>): <short summary>
    <BLANK LINE>
    <body>
    <BLANK LINE>
    <footer>
```

--------------------------------

### Initialize Ping Protect on Callback

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

Delay Ping Protect initialization until a PingOneProtectInitializeCallback is received from the server. This is an asynchronous call and requires error handling.

```javascript
import { PIProtect } from '@forgerock/ping-protect';

if (step.getCallbacksOfType('PingOneProtectInitializeCallback')) {
  try {
    // Asynchronous call
    await PIProtect.start({ envId: '02fb1243-189a-4bc7-9d6c-a919edf6447' });
  } catch (err) {
    // handle error
  }
}
```

--------------------------------

### Register Token Vault Client

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Initializes and registers the Token Vault client, including the interceptor and proxy. Configure the ForgeRock SDK settings after registration.

```javascript
import { Config, TokenManager } from '@forgerock/javascript-sdk';
import { client } from '@forgerock/token-vault';

const register = client({
  /* global config */
});

register.interceptor();
register.proxy(document.getElementById('token-vault'));

const tokenVaultStore = register.store();

Config.set({
  /* ForgeRock SDK config */
});
```

--------------------------------

### Manually Refresh Tokens with tokenVaultStore.refresh()

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Manually trigger a token refresh using the `refresh` method on the `tokenVaultStore`. This method attempts to refresh tokens if needed and returns an object with a `refreshTokens` boolean property.

```javascript
const tokenVaultStore = register.store();

const { refreshTokens } = tokenVaultStore.refresh();

console.log(refreshTokens); // logs `true` or `false`
```

--------------------------------

### Set Ping Protect Data on Callback

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

After obtaining the data using PIProtect.getData(), set it on the callback using setData() before calling FRAuth.next(step) to send it to the server.

```javascript
callback.setData(data);

FRAuth.next(step);
```

--------------------------------

### Create a New Feature Branch

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/CONTRIBUTING.md

Always create a new branch for your changes. Avoid direct modifications to the develop or master branches.

```bash
git checkout -b feature/my-new-feature
```

--------------------------------

### Check Token Presence with tokenVaultStore.has()

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Use the `has` method on the `tokenVaultStore` to check if tokens are present. This method returns an object with a `hasTokens` boolean property and does not validate the tokens themselves.

```javascript
const tokenVaultStore = register.store();

const { hasTokens } = tokenVaultStore.has();

console.log(hasTokens); // logs `true` or `false`
```

--------------------------------

### PingOneProtectEvaluationCallback Methods

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

Methods for the PingOneProtectEvaluationCallback, such as setting data, client errors, and retrieving pause behavioral data status.

```javascript
callback.setData();
callback.setClientError();
callback.getPauseBehavioralData();
```

--------------------------------

### Configure Token Vault Proxy

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Configures the Token Vault proxy, which requires the application's origin and a list of protected endpoint URLs identical to those used in the interceptor configuration.

```javascript
// proxy/src/proxy.js
import { proxy } from '@forgerock/token-vault';

proxy({
  app: {
    // This MUST match the origin on which your main app runs
    origin: 'https://app.example.com',
  },
  forgerock: {
    // The below MUST match what you configured in your main app and interceptor
    clientId: 'WebOAuthClient',
    redirectUri: location.href,
    scope: 'openid email profile',
    serverConfig: {
      baseUrl: 'https//auth.example.com/am/',
      timeout: 5000,
    },
    realmPath: 'alpha',
  },
  proxy: {
    urls: [
      /* Your protected endpoints; should be identical to `interceptor.urls` */
    ],
  },
});
```

--------------------------------

### Log Out User with FRUser

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Revoke tokens and log out the user by calling FRUser.logout(). This action destroys the session, revokes tokens on the server, and clears them from the browser.

```javascript
import { FRUser } from '@forgerock/javascript-sdk';

FRUser.logout();
```

--------------------------------

### Configure Token Vault Interceptor

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/token-vault/README.md

Configures the Token Vault interceptor within the Service Worker's entry file. It requires a list of protected endpoint URLs for security.

```javascript
// app/interceptor/inteceptor.js
import { interceptor } from '@forgerock/token-vault';

interceptor({
  interceptor: {
    // Only fully qualified URLs can be used here, or
    // a single, ending glob can be used
    urls: [
      /* Your protected endpoint URLs */
    ],
  },
  forgerock: {
    // The below MUST match what you configured in your main app
    serverConfig: {
      baseUrl: 'https//auth.example.com/am/',
      timeout: 5000,
    },
    realmPath: 'alpha',
  },
});
```

--------------------------------

### Handle Evaluation Errors

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/packages/ping-protect/README.md

For errors during the evaluation step, use setClientError() on the PingOneProtectEvaluationCallback to report the error message to the server.

```javascript
let data;

if (step.getCallbacksOfType('PingOneProtectEvaluationCallback')) {
  const callback = step.getCallbackOfType('PingOneProtectEvaluationCallback');
  try {
    // Asynchronous call
    data = await PIProtect.getData();
  } catch (err) {
    callback.setClientError(err.message);
  }
}
```

--------------------------------

### Catching Specific Error Tags

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/e2e/mock-api-v2/README.md

Use `catchTag` to intercept a specific error type, such as 'NoSuchElementException', and provide a custom error response, like an unauthorized HTTP error.

```typescript
Effect.catchTag('NoSuchElementException', () =>
  HttpError.unauthorizedError('no such element found'),
);
```

--------------------------------

### Define a Custom Error in Effect

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/e2e/mock-api-v2/README.md

Use this pattern to create custom errors within the Effect ecosystem. The `_tag` property is crucial for error handling via `catchTags`.

```typescript
class MyErrorName {
  readonly _tag  = 'MyErrorName'
}
```

--------------------------------

### Understanding the Effect Type

Source: https://github.com/forgerock/forgerock-javascript-sdk/blob/develop/e2e/mock-api-v2/README.md

The Effect type defines the success type, error type, and required services for an operation. Understanding these generics is crucial for error handling.

```typescript
Effect<Success, Error, Requirements>;
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.