---
name: verify-share-card
description: Verify the local Shopify/WooCommerce polaroid share-card compositor, full-photo fit, identity fallbacks and final disclosure without generation or store access.
---

# Polaroid share-card verification

Scope: the card asset exported by the existing share controls. This skill does not establish storefront, landing, native share-sheet or physical-phone behavior. Those remain covered by their existing suites and separately authorized store QA.

## Launch

Run from the repository root after installing the widget dependencies. Shopify uses `extensions/virtual-tryon-src`; WordPress uses `widget-src`. The helper loads TypeScript from that package and executes the production `src/shareCard.ts` through a real native Canvas 2D implementation. It starts no server and needs no network, API keys or try-on generation.

Install `@napi-rs/canvas` in a scratch directory if it is not available, then set `CANVAS_MODULE` to its absolute package directory. In the issue #54 workspace it is already installed:

```sh
export CANVAS_MODULE=/opt/sand/sand-host/node_modules/@napi-rs/canvas
node .cursor/skills/verify-share-card/render.cjs --doctor
node .cursor/skills/verify-share-card/render.cjs /tmp/polaroid-photo.jpg /tmp/polaroid-thumbnail.jpg /tmp/polaroid-proof
```

For this workspace, recreate those scratch inputs from the approved reference with:

```sh
python3 - <<'PYIMAGE'
from pathlib import Path
import base64, re
images = re.findall(r'src="data:image/[^;]+;base64,([^"]+)"', Path('../../design/card-fix-v3-c.html').read_text())
for name, data in zip(['photo', 'thumbnail'], images):
    Path('/tmp/polaroid-' + name + '.jpg').write_bytes(base64.b64decode(data))
PYIMAGE
```

The two input files must be saved images, never fetched or generated by this skill. Pass `-` for the thumbnail to exercise its placeholder. Use a distinct output directory per repository/run to preserve evidence. In the issue #54 workspace the inputs were extracted without transformation from the photo and thumbnail data URLs in `design/card-fix-v3-c.html`. The photo is the existing reconstructed swimwear reference, not a newly generated image or a newly recovered raw API result.

## Doctor

`node .cursor/skills/verify-share-card/render.cjs --doctor` must print the source path, source SHA-256, both card dimensions and the canvas runtime, and exit zero. If it fails, fix missing local dependencies before driving. After a failed drive, rerun doctor and launch a fresh helper process.

## Drive

Read [the feature map](features/README.md). One helper invocation drives every mapped compositor feature serially in a short-lived process: Story and Post, normal identity, missing thumbnail, long identity and empty identity. It asserts real draw-call coordinates, full-source image fitting, native text bounds inside their caption/tag/chip/strip rectangles, UI/photo separation and the final watermark draw.

For the browser user path, WordPress's `cd widget-src && npm run test:browser` builds the real bundle, exercises result and gallery Share controls, downloads PNGs and checks clipboard/landing behavior using the existing fixture boundary. It requires local sockets and Chrome. Do not report native-canvas verification as a substitute for this UI suite. Shopify has component tests for the share controls and the full `python3 scripts/quality_gate.py` gate.

## Evidence

The helper writes eight PNGs and `polaroid-verification.json` (input/source hashes, geometry and actual draw calls) in the chosen output directory. Inspect both standard PNGs and the long-name/placeholder variants. The expected windows contain the whole photo; all caption content is below them; paper occupies the canvas and the disclosure occupies the bottom lip. This is local compositor evidence, not live store evidence. No mocks are used for raster rendering; the helper observes native operations without replacing drawing. Unit suites separately cover CORS/load/export fallback at the browser image boundary.

Also run `npm run check:shared` at the Shopify root or in WordPress's widget directory. It verifies all eight shared modules/tests/fixtures against the committed hashes and a sibling checkout when present. For checkouts elsewhere, set `SHARE_PEER_SRC` to the other widget's `src` directory. Update both copies and manifests together whenever shared code changes.

## Cleanup

The helper exits without leaving browsers, servers or scratch instances. Evidence survives teardown: verify that `polaroid-verification.json`, `card-polaroid-impl-story.png` and `card-polaroid-impl-post.png` still exist. Never delete evidence as cleanup. If browser checks are run, let Playwright close its own browser/server and retain its report. Never kill unrelated processes.

## Helpers

`render.cjs` is executable; the exact doctor and render invocations are above. It accepts `PHOTO THUMB_OR_- OUTPUT_DIRECTORY`. Re-run `/maintain-verification-skill` after card behavior changes.