Pass customData into iframe for interactive atoms

[frederickobrien]

Following on from #16612, this adjusts a silly mistake I made for interactive atoms on non interactive pages. Before the custom data was being attached to the element outside of the iframe, rendering it useless to atoms inside. Here we pass the data into the iframe so the atom can use it.

The helper function on the interactive atom side would then shift to something like this:

export const getAtomCustomData = <T>(): T | null => {
    // Inside an iframe — data injected as a global
    if ('__atomCustomData' in window) {
        return window.__atomCustomData as T;
    }
    // Outside an iframe — data on the DOM element
    const container = document.querySelector(`[data-atom-custom-data]`);
    if (!container) return null;
    const raw = container.getAttribute('data-atom-custom-data');
    if (!raw) return null;
    try {
        return JSON.parse(raw) as T;
    } catch {
        console.warn('Failed to parse data-atom-custom-data');
        return null;
    }
};

[github-actions]

🚀 Image pushed to AWS ECR

Image digest: sha256:6f1b26bc4c5f0e5e01fe1c01f6722699304525c4c82eb5bd3c3ce47eda666923

🐛 Run the image locally

The following can be used to run the image locally:

# Refer to image using the immutable digest. Find alternatives below.
IMAGE_IDENTIFIER="@sha256:6f1b26bc4c5f0e5e01fe1c01f6722699304525c4c82eb5bd3c3ce47eda666923"

# Refer to image using branch tag
# IMAGE_IDENTIFIER=":branch-pass-customdata-into-iframe"

# Refer to image using build tag
# IMAGE_IDENTIFIER=":build-30787"

# Refer to image via the GitHub commit SHA tag
# IMAGE_IDENTIFIER=":sha-04c768c7f4d4da1f047cc97a0d6366d1fba06f59"

# Set environment variables for the AWS CLI
AWS_PROFILE="<A_PROFILE_FROM_JANUS>"
AWS_DEFAULT_REGION="eu-west-1"

IMAGE_ACCOUNT_ID=$(aws ssm get-parameter --name /organisation/accounts/deployTools --query "Parameter.Value" --output text)
REGISTRY="${IMAGE_ACCOUNT_ID}.dkr.ecr.${AWS_DEFAULT_REGION}.amazonaws.com"
IMAGE="${REGISTRY}/guardian/dotcom-rendering${IMAGE_IDENTIFIER}"

# Login to AWS ECR https://docs.aws.amazon.com/AmazonECR/latest/userguide/registry_auth.html
aws ecr get-login-password | docker login --username AWS --password-stdin $REGISTRY

# Pull the image
docker pull $IMAGE

# Run the image. You'll likely need to set additional flags. See https://docs.docker.com/reference/cli/docker/container/run.
docker run $IMAGE

---

From guardian/actions-publish-image.

[github-actions]

Hello 👋! When you're ready to run Chromatic, please apply the run_chromatic label to this PR.

You will need to reapply the label each time you want to run Chromatic.

Click here to see the Chromatic project.

[github-actions]

Deploy build 30787 of dotcom:rendering-all to CODE

All deployment options

• Deploy build 30787 of dotcom:rendering-all to CODE
• Deploy parts of build 30787 to CODE by previewing it first
• What's on CODE right now?

---

From guardian/actions-riff-raff.

[gu-prout]

Seen on PROD (merged by @frederickobrien 8 minutes and 57 seconds ago) Please check your changes!