[{"data":1,"prerenderedAt":322},["ShallowReactive",2],{"navigation_docs":3,"-manifest":93,"-manifest-surround":317},[4,41,46,89],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":40},"Learn","i-lucide-book-open","\u002Flearn","1.learn",[10,15,20,25,30,35],{"title":11,"path":12,"stem":13,"icon":14},"What visual regression testing is","\u002Flearn\u002Fwhat-is-visual-regression-testing","1.learn\u002F1.what-is-visual-regression-testing","i-lucide-eye",{"title":16,"path":17,"stem":18,"icon":19},"How image diffing works","\u002Flearn\u002Fhow-image-diffing-works","1.learn\u002F2.how-image-diffing-works","i-lucide-diff",{"title":21,"path":22,"stem":23,"icon":24},"Why screenshots flake","\u002Flearn\u002Fwhy-screenshots-flake","1.learn\u002F3.why-screenshots-flake","i-lucide-shuffle",{"title":26,"path":27,"stem":28,"icon":29},"Baselines and approval","\u002Flearn\u002Fbaselines-and-approval","1.learn\u002F4.baselines-and-approval","i-lucide-check-check",{"title":31,"path":32,"stem":33,"icon":34},"Running in CI","\u002Flearn\u002Frunning-in-ci","1.learn\u002F5.running-in-ci","i-lucide-workflow",{"title":36,"path":37,"stem":38,"icon":39},"Choosing a tool","\u002Flearn\u002Fchoosing-a-tool","1.learn\u002F6.choosing-a-tool","i-lucide-list-checks",false,{"title":42,"path":43,"stem":44,"icon":45},"Compare the tools","\u002Fcompare","2.compare","i-lucide-scale",{"title":47,"path":48,"stem":49,"children":50,"icon":53},"Manifest","\u002Fmanifest","3.manifest\u002F1.index",[51,54,59,64,69,74,79,84],{"title":52,"path":48,"stem":49,"icon":53},"The run manifest","i-lucide-file-json",{"title":55,"path":56,"stem":57,"icon":58},"The format","\u002Fmanifest\u002Fformat","3.manifest\u002F2.format","i-lucide-file-code",{"title":60,"path":61,"stem":62,"icon":63},"Reading manifests","\u002Fmanifest\u002Freading","3.manifest\u002F3.reading","i-lucide-book-open-check",{"title":65,"path":66,"stem":67,"icon":68},"Merging the manifests of a run","\u002Fmanifest\u002Fmerging","3.manifest\u002F4.merging","i-lucide-merge",{"title":70,"path":71,"stem":72,"icon":73},"Writing manifests","\u002Fmanifest\u002Fwriting","3.manifest\u002F5.writing","i-lucide-pencil-line",{"title":75,"path":76,"stem":77,"icon":78},"Converting to and from other formats","\u002Fmanifest\u002Fconverting","3.manifest\u002F6.converting","i-lucide-arrow-left-right",{"title":80,"path":81,"stem":82,"icon":83},"Reference","\u002Fmanifest\u002Freference","3.manifest\u002F7.reference","i-lucide-list",{"title":85,"path":86,"stem":87,"icon":88},"Schema reference","\u002Fmanifest\u002Fschema","3.manifest\u002F8.schema","i-lucide-braces",{"title":90,"path":91,"stem":92,"icon":14},"Viewer","\u002Fviewer","4.viewer",{"id":94,"title":52,"body":95,"description":310,"extension":311,"links":312,"meta":313,"navigation":314,"path":48,"seo":315,"stem":49,"__hash__":316},"docs\u002F3.manifest\u002F1.index.md",{"type":96,"value":97,"toc":304},"minimark",[98,102,115,136,141,177,192,196,199,255,268,272,297,300],[99,100,101],"p",{},"Every visual regression tool ends a run the same way: some comparisons passed, some failed, some had no baseline yet, and the images are somewhere on disk. What happens next, a comment on the pull request, a review screen, a button that approves a baseline, needs that information in a form a program can read. Today almost every tool leaves image folders and nothing else, and every review tool parses logs or walks directories to work out what happened.",[99,103,104,105,109,110,114],{},"The ",[106,107,108],"strong",{},"visual regression manifest"," is that missing file: ",[111,112,113],"code",{},"visual-regression-manifest.json",", one per run, listing every comparison with its status, diff ratio, threshold and the paths of the baseline, actual and diff images, plus where the run happened (CI provider, repository, commit, pull request) and what ran it.",[116,117,118,122,129,133],"card-group",{},[119,120,121],"card",{"icon":58,"title":55,"to":56},"An annotated example, the status table and the rules every writer and reader follows.",[119,123,124,125,128],{"icon":88,"title":85,"to":86},"Every field, generated from the JSON Schema at ",[111,126,127],{},"\u002Fschema\u002Fv1.json",".",[119,130,132],{"icon":78,"title":131,"to":76},"Converting","Make a manifest from Playwright, Vitest, jest-image-snapshot, cypress-visual-regression, BackstopJS, Roborazzi or plain image files; export to CTRF.",[119,134,135],{"icon":14,"title":90,"to":91},"Drop a manifest and its images into the browser and review them. Nothing is uploaded.",[137,138,140],"h2",{"id":139},"built-upon-ctrf","Built upon CTRF",[99,142,143,150,151,154,155,154,158,154,161,154,164,154,167,154,170,154,173,176],{},[144,145,149],"a",{"href":146,"rel":147},"https:\u002F\u002Fctrf.io",[148],"nofollow","CTRF",", the Common Test Report Format, is the one cross-tool test results format with a growing ecosystem of reporters and CI integrations. It has no notion of a screenshot comparison: no baseline, actual and diff triple, no diff ratio, no \"needs a baseline\" outcome. Rather than invent a parallel vocabulary, the manifest uses CTRF's names wherever CTRF has a field (",[111,152,153],{},"reportFormat",", ",[111,156,157],{},"specVersion",[111,159,160],{},"tool",[111,162,163],{},"summary",[111,165,166],{},"commit",[111,168,169],{},"buildId",[111,171,172],{},"osPlatform",[111,174,175],{},"extra",", attachments) and adds only what a visual comparison needs.",[99,178,179,180,183,184,187,188,191],{},"The result is a file that converts to a CTRF report and back without renaming anything: ",[111,181,182],{},"toCtrf"," writes one CTRF test of ",[111,185,186],{},"type: \"visual\""," per comparison with the images as attachments, so every CTRF-aware PR summary or dashboard shows your visual results today, and ",[111,189,190],{},"fromCtrf"," reads it back. A proposal to document the visual fields upstream is open with the CTRF maintainers.",[137,193,195],{"id":194},"implementations","Implementations",[99,197,198],{},"The manifest is not a standard. It is an open format with one maintainer, a schema, a reference library and converters, and this table is the honest state of adoption. It becomes a standard the day a second tool writes or reads it without asking.",[200,201,202,221],"table",{},[203,204,205],"thead",{},[206,207,208,212,218],"tr",{},[209,210,211],"th",{},"Writes it natively",[209,213,214,215],{},"Converted by ",[111,216,217],{},"visual-regression-manifest",[209,219,220],{},"Reads it",[222,223,224],"tbody",{},[206,225,226,235,246],{},[227,228,229,234],"td",{},[144,230,233],{"href":231,"rel":232},"https:\u002F\u002Fpixsame.com",[148],"pixsame"," Cypress plugin",[227,236,237,238,241,242,245],{},"Playwright ",[111,239,240],{},"toHaveScreenshot",", Vitest ",[111,243,244],{},"toMatchScreenshot",", jest-image-snapshot, cypress-image-snapshot, cypress-visual-regression, BackstopJS, Roborazzi, any tool that leaves baseline\u002Factual\u002Fdiff images",[227,247,248,249,252,253],{},"the ",[144,250,251],{"href":91},"viewer",", the pixsame GitHub App (in preparation), anything that reads CTRF via ",[111,254,182],{},[99,256,257,258,263,264,267],{},"Adding your tool to the middle column is one file and one test in the ",[144,259,262],{"href":260,"rel":261},"https:\u002F\u002Fgithub.com\u002FVisual-Regression\u002Fvisual-regression",[148],"repository","; adding it to the first is ",[111,265,266],{},"ManifestWriter"," and a few lines in your plugin. Both are welcome.",[137,269,271],{"id":270},"install","Install",[273,274,279],"pre",{"className":275,"code":276,"language":277,"meta":278,"style":278},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npm install visual-regression-manifest\n","bash","",[111,280,281],{"__ignoreMap":278},[282,283,286,290,294],"span",{"class":284,"line":285},"line",1,[282,287,289],{"class":288},"sBMFI","npm",[282,291,293],{"class":292},"sfazB"," install",[282,295,296],{"class":292}," visual-regression-manifest\n",[99,298,299],{},"The package has no runtime dependencies and ships the JSON Schema, TypeScript types, a reader with validation, a writer that keeps the file complete even when the run is killed, a merger for runs split across machines, and the converters.",[301,302,303],"style",{},"html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":278,"searchDepth":305,"depth":305,"links":306},2,[307,308,309],{"id":139,"depth":305,"text":140},{"id":194,"depth":305,"text":195},{"id":270,"depth":305,"text":271},"One JSON file per test run that lists every screenshot comparison, built upon CTRF, written by several tools and read by PR bots and review apps.","md",null,{},{"icon":53},{"title":52,"description":310},"b1N5rXan5VMqAYfxg58rsS3KBnfvUvnwVKJnwo9P5Xg",[318,320],{"title":42,"path":43,"stem":44,"description":319,"icon":45,"children":-1},"Runner integrations, hosted review services, diff engines and mobile tools, compared on facts from their own docs.",{"title":55,"path":56,"stem":57,"description":321,"icon":58,"children":-1},"The normative description is the JSON Schema (draft 2020-12) at https:\u002F\u002Fvisual-regression.dev\u002Fschema\u002Fv1.json, shipped as schema.json (in the package, and in the repository under src\u002F) and importable as visual-regression-manifest\u002Fschema.json or the manifestSchema export.",1791993875091]