diff --git a/packages/locuszoom/src/Plugin.vue b/packages/locuszoom/src/Plugin.vue
index d0809d3b..06778284 100644
--- a/packages/locuszoom/src/Plugin.vue
+++ b/packages/locuszoom/src/Plugin.vue
@@ -262,7 +262,7 @@ watch(
         class="absolute mt-1 p-3 border bg-red-100 text-red-700 text-sm rounded opacity-95 w-[100%]">
         {{ errorMessage }}
     </div>
-    <div id="lz-plot" class="h-100"></div>
+    <div id="lz-plot" class="h-full"></div>
 </template>
 
 <style>
diff --git a/packages/locuszoom/test-data/test.png b/packages/locuszoom/test-data/test.png
new file mode 100644
index 00000000..17578ae1
Binary files /dev/null and b/packages/locuszoom/test-data/test.png differ
diff --git a/packages/locuszoom/test.spec.js b/packages/locuszoom/test.spec.js
index 33d0b2b9..eeaa174e 100644
--- a/packages/locuszoom/test.spec.js
+++ b/packages/locuszoom/test.spec.js
@@ -7,6 +7,8 @@ const __dirname = dirname(fileURLToPath(import.meta.url));
 const BGZIP = readFileSync(resolve(__dirname, "test-data/test.gwas_bgzip"));
 const TABIX = readFileSync(resolve(__dirname, "test-data/test.gwas_bgzip.tbi"));
 
+const maxDiffPixelRatio = 0.06;
+
 function fulfillBinary(route, data) {
     const rangeHeader = route.request().headers()["range"];
     const match = rangeHeader?.match(/bytes=(\d+)-(\d+)/);
@@ -58,4 +60,5 @@ test("Run plot", async ({ page }) => {
     await expect(PHENO_STAT_TO_CLICK).toBeVisible();
     await page.getByRole("button", { name: "×" }).click();
     await expect(PHENO_STAT_TO_CLICK).toBeHidden();
+    await expect(page).toHaveScreenshot("test.png", { maxDiffPixelRatio });
 });