Skip to content

README.md

Latest commit

 

History

History
119 lines (80 loc) · 3.14 KB

README.md

File metadata and controls

119 lines (80 loc) · 3.14 KB

Contentful Logo

Contentful Personalization & Analytics

Web SDK Vanilla JS Reference Implementation

Warning

The Optimization SDK Suite is pre-release (alpha). Breaking changes can be published at any time.

This is a reference implementation for the Optimization Web SDK and is part of the Contentful Optimization SDK Suite.

What this demonstrates

Use this implementation when you need the smallest browser example for the Web SDK without a framework layer. It demonstrates a static HTML integration, local mock API usage, Web SDK asset copying, and Playwright coverage for browser-side optimization and tracking behavior.

Prerequisites

  • Node.js >= 20.19.0 (24.13.0 recommended to match .nvmrc)
  • pnpm 10.x
  • Docker running locally for nginx-based serving

Setup

Run all steps from the monorepo root.

  1. Install pnpm packages:

    pnpm install

  2. Build the local package tarballs consumed by implementations:

    pnpm build:pkgs

  3. Install this implementation so its local @contentful/* dependencies resolve from pkgs/:

    pnpm implementation:run -- web-sdk implementation:install

  4. Configure the environment in a .env file in implementations/web-sdk based on the .env.example included file. The file is pre-populated with values that are valid only against the mock server implementation. To test the implementation against a live server environment, see the mocks package for information on how to set up Contentful space with test data.

Running locally

Run these commands from the monorepo root.

  1. Start servers:

    pnpm implementation:run -- web-sdk serve

  2. Stop servers:

    pnpm implementation:run -- web-sdk serve:stop

  3. Run E2E:

    pnpm test:e2e:web-sdk

The application can be accessed via Web browser at http://localhost:3000. See implementations/web-sdk/package.json for lower-level local commands.

Running E2E tests

E2E tests are run using Playwright.

  1. Install implementation dependencies, browser binaries, and system dependencies:

    pnpm setup:e2e:web-sdk

  2. Run the E2E test suite:

    pnpm test:e2e:web-sdk

    The tests can alternatively be run using Playwright's GUI:

    pnpm implementation:run -- web-sdk test:e2e:ui

Related