This is how you retrieve variants using GraphQL:

{
  content {
    page(id: "123456") {
      id
      name
      contentVariants {
        content {
          id
        }
        conditionStrings
      }
    }
  }
}

The output would look like this:

{
  "data": {
    "content": {
      "page": {
        "id": "123456",
        "name": "The Page",
        "contentVariants": [
          {
            "content": {
              "id": "345678"
            },
            "conditionStrings": [
              "cmec:///p13n/segment/12345678901234567890;cmecType=segment"
            ]
          }
        ]
      }
    }
  }
}

The contentVariants attribute contains all variants in order of descending priority as per ContentVariantService.getVariants(). You should render the first variant for which one of its conditions is met and for which the content attribute is defined. If no variant with a matching condition is found, the baseline should be rendered.

Some of the variants may be test control variants, for which the content field is not set. In such a case, the GraphQL result might look like this:

{
  "data": {
    "content": {
      "page": {
        "id": "123456",
        "name": "The Page",
        "contentVariants": [
          {
            "content": null,
            "conditionStrings": [
              "cmec:///p13n/variant/567890"
            ]
          },
          {
            "content": {
              "id": "345678"
            },
            "conditionStrings": [
              "cmec:///p13n/variant/567891"
            ]
          }
        ]
      }
    }
  }
}

If the conditions of a test control variant apply, the choice of the test control should be tracked, but you should continue to search for less prioritized variants with a non-null content attribute and satisfied conditions for rendering. If there is no such variant, use the baseline.