Read the visitor's test group

An assignment is the test group ABConvert put the visitor in. Read it when your own code needs to know. The samples use abconvert, the client your stack guide creates on the server, and useABConvert() in a component.

Read an assignment

Use this to keep your storefront consistent with a test. To render a different version of a page per test group, see Feature tests (coming soon). Read it on the server, or in the browser in a component. Both use the same method.

const assignment = abconvert.getAssignment('49603');

// Show the banner to every test group except Control
const showBanner = assignment ? !assignment.testGroup.control : false;

// components/FreeShippingBanner.tsx
import { useABConvert } from '@abconvert/headless/react';

export function FreeShippingBanner() {
  const { getAssignment } = useABConvert();
  const assignment = getAssignment('49603');

  // Show the banner to every test group except Control
  if (!assignment || assignment.testGroup.control) return null;
  return <Banner>Free shipping on every order</Banner>;
}

'49603' is the test ID shown in the ABConvert admin. getAssignment returns null when the visitor is not in the test. getAssignments() returns every assignment for the visitor.

Send test groups to another tool

Pass onAssignment to the provider. It runs in the browser once the visitor allows analytics: once for each test they are in, on every page load.

Browser (provider)

<ABConvertProvider
  pageState={pageState}
  onAssignment={(assignment) => {
    // Send one event per test to your analytics tool
    analytics.track('ABConvert test group', {
      testId: assignment.experimentId,
      testGroupIndex: assignment.testGroup.index,
    });
  }}
>
  {children}
</ABConvertProvider>

The provider also fires the abconvert:assignment-ready event on window, at the same moment. It is the event ABConvert fires on a theme. A tag manager trigger built on it keeps working. See Events. Neither runs for a forced or preview assignment.

Common mistakes

Using testGroup.name as an identifier. The name is a display label that can change while the test runs. The fix: send testGroup.index to other tools and branch on testGroup.control in your code.

Get started

Build

Configure

Advanced

Reference

Read the visitor's test group

Read an assignment

Send test groups to another tool

Common mistakes

​Read an assignment

​Send test groups to another tool

​Common mistakes

Read an assignment

Send test groups to another tool

Common mistakes