diff --git a/niivue/src/components/Menu.ts b/niivue/src/components/Menu.ts
index 80330db..d27a090 100644
--- a/niivue/src/components/Menu.ts
+++ b/niivue/src/components/Menu.ts
@@ -4,8 +4,7 @@ import { Signal, computed, effect, useSignal } from '@preact/signals'
 import { addImagesEvent, addOverlayEvent, openImageFromURL } from '../events'
 import { SLICE_TYPE } from '@niivue/niivue'
 import { ScalingBox } from './ScalingBox'
-import { getMetadataString } from '../utility'
-import { getNumberOfPoints } from '../utility'
+import { getMetadataString, getNumberOfPoints } from '../utility'
 import {
   HeaderDialog,
   ImageSelect,
diff --git a/niivue/src/events.ts b/niivue/src/events.ts
index d6b613f..83cae05 100644
--- a/niivue/src/events.ts
+++ b/niivue/src/events.ts
@@ -52,6 +52,8 @@ export function listenToMessages(appProps: AppProps) {
 }
 
 function handleDebugMessage(body: any, appProps: AppProps) {
+  // sending arrays is fine, dataBuffer does not work
+  // sending objects only works with one element inside
   const { nvArray } = appProps
   switch (body) {
     case 'getNCanvas':
@@ -64,8 +66,6 @@ function handleDebugMessage(body: any, appProps: AppProps) {
       break
     case 'getMinMaxOfFirstImage':
       {
-        console.log('nv.volumes:')
-        console.log(nvArray.value[0].volumes[0])
         window.postMessage({
           type: 'debugAnswer',
           body: [nvArray.value[0].volumes[0].cal_min, nvArray.value[0].volumes[0].cal_max],
@@ -131,30 +131,29 @@ function addMeshOverlay(nv: Niivue, item: any, type: string) {
     mesh.layers.pop()
   }
   if (!item.data) {
-    console.log('Running loadFromURL');
     NVMesh.loadLayer(
-      {url: item.uri, 
-      opacity:a.opacity,
-      colormap:a.colormap,
-      colormapNegative:a.colormapNegative,
-      useNegativeCmap:a.useNegativeCmap,
-      cal_min:a.calMin,
-      cal_max:a.calMax,
+      {
+        url: item.uri,
+        opacity: a.opacity,
+        colormap: a.colormap,
+        colormapNegative: a.colormapNegative,
+        useNegativeCmap: a.useNegativeCmap,
+        cal_min: a.calMin,
+        cal_max: a.calMax,
       },
       mesh,
-      )
+    )
   } else {
-    console.log('Running readLayer');
     NVMesh.readLayer(
-    item.uri,
-    item.data,
-    mesh,
-    a.opacity,
-    a.colormap,
-    a.colormapNegative,
-    a.useNegativeCmap,
-    a.calMin,
-    a.calMax,
+      item.uri,
+      item.data,
+      mesh,
+      a.opacity,
+      a.colormap,
+      a.colormapNegative,
+      a.useNegativeCmap,
+      a.calMin,
+      a.calMax,
     )
   }
   mesh.updateMesh(nv.gl)
@@ -162,12 +161,7 @@ function addMeshOverlay(nv: Niivue, item: any, type: string) {
   nv.updateGLVolume()
   const layerNumber = nv.meshes[0].layers.length - 1
   if (type === 'addMeshCurvature') {
-    nv.setMeshLayerProperty(
-      nv.meshes[0].id,
-      layerNumber,
-      'colorbarVisible',
-      false,
-    )
+    nv.setMeshLayerProperty(nv.meshes[0].id, layerNumber, 'colorbarVisible', false)
   }
 }
 
diff --git a/niivue/tests/Images.spec.ts b/niivue/tests/Images.spec.ts
new file mode 100644
index 0000000..dab2558
--- /dev/null
+++ b/niivue/tests/Images.spec.ts
@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test'
+import { BASE_URL, loadTestImage } from './utils'
+
+test.describe('Loading images', () => {
+  test('loads a test image', async ({ page }) => {
+    await page.goto(BASE_URL)
+
+    await loadTestImage(page)
+
+    expect(await page.waitForSelector('canvas')).toBeTruthy()
+    expect(await page.$$('canvas')).toHaveLength(1)
+    expect(
+      await page.textContent('text=/matrix size: 207 x 256 x 215, voxelsize: 0.74 x 0.74 x 0.74/i'),
+    ).toBeTruthy()
+
+    await loadTestImage(page)
+    expect(await page.$$('canvas')).toHaveLength(2)
+  })
+})
diff --git a/niivue/tests/Menu.spec.ts b/niivue/tests/Menu.spec.ts
new file mode 100644
index 0000000..508b477
--- /dev/null
+++ b/niivue/tests/Menu.spec.ts
@@ -0,0 +1,79 @@
+import { test, expect } from '@playwright/test'
+import { BASE_URL, loadTestImage } from './utils'
+
+test.describe('Menu', () => {
+  test('displays home screen', async ({ page }) => {
+    await page.goto(BASE_URL)
+
+    expect(await page.textContent('text=/Home/i')).toBeTruthy()
+    expect(await page.textContent('text=/Add Image/i')).toBeTruthy()
+    expect(await page.textContent('text=/View/i')).toBeTruthy()
+    expect(await page.textContent('text=/Bookmarklet/i')).toBeTruthy()
+    expect(await page.textContent('text=/Drop Files to load images/i')).toBeTruthy()
+  })
+
+  test('menubar updates with loading images', async ({ page }) => {
+    await page.goto(BASE_URL)
+
+    // initially only these menu items are visible
+    expect(await page.textContent('text=/Home/i')).toBeTruthy()
+    expect(await page.textContent('text=/Add Image/i')).toBeTruthy()
+    expect(await page.textContent('text=/View/i')).toBeTruthy()
+
+    // initially these menu items do not exist
+    expect(await page.$('text=/ColorScale/i')).toBeNull()
+    expect(await page.$('text=/Overlay/i')).toBeNull()
+    expect(await page.$('text=/Header/i')).toBeNull()
+    expect(await page.$('text=/Select/i')).toBeNull()
+
+    // load an image
+    await loadTestImage(page)
+    expect(await page.waitForSelector('canvas')).toBeTruthy()
+    expect(
+      await page.textContent('text=/matrix size: 207 x 256 x 215, voxelsize: 0.74 x 0.74 x 0.74/i'),
+    ).toBeTruthy()
+
+    // after loading an image these are visible
+    expect(await page.textContent('text=/Home/i')).toBeTruthy()
+    expect(await page.textContent('text=/Add Image/i')).toBeTruthy()
+    expect(await page.textContent('text=/View/i')).toBeTruthy()
+    expect(await page.textContent('text=/ColorScale/i')).toBeTruthy()
+    expect(await page.textContent('text=/Overlay/i')).toBeTruthy()
+    expect(await page.textContent('text=/Header/i')).toBeTruthy()
+
+    // the select menu item is only visible after loading 2 images
+    expect(await page.$('text=/Select/i')).toBeNull()
+    await loadTestImage(page)
+    expect(await page.textContent('text=/Select/i')).toBeTruthy()
+  })
+
+  test('loads an image and checks the menu bar', async ({ page }) => {
+    await page.goto(BASE_URL)
+
+    await loadTestImage(page)
+
+    expect(await page.waitForSelector('canvas')).toBeTruthy()
+    expect(await page.$$('canvas')).toHaveLength(1)
+    expect(
+      await page.textContent('text=/matrix size: 207 x 256 x 215, voxelsize: 0.74 x 0.74 x 0.74/i'),
+    ).toBeTruthy()
+
+    const menuBar = ['Home', 'Add Image', 'View', 'ColorScale', 'Overlay', 'Header']
+    for (const item of menuBar) {
+      expect(await page.textContent(`text=/${item}/i`)).toBeTruthy()
+    }
+  })
+
+  test('opens the example image via the menu bar', async ({ page }) => {
+    await page.goto(BASE_URL)
+
+    await page.click('data-testid=menu-item-dropdown-Add Image')
+    await page.click('text=/Example Image/i')
+
+    expect(await page.waitForSelector('canvas')).toBeTruthy()
+    expect(await page.$$('canvas')).toHaveLength(1)
+    expect(
+      await page.textContent('text=/matrix size: 207 x 256 x 215, voxelsize: 0.74 x 0.74 x 0.74/i'),
+    ).toBeTruthy()
+  })
+})
diff --git a/niivue/tests/Meshes.spec.ts b/niivue/tests/Meshes.spec.ts
new file mode 100644
index 0000000..199f81a
--- /dev/null
+++ b/niivue/tests/Meshes.spec.ts
@@ -0,0 +1,33 @@
+import { test, expect } from '@playwright/test'
+import { BASE_URL, loadTestSurfImage, loadTestSurfOverlay } from './utils'
+
+test.describe('Loading meshes', () => {
+  test('loads a test surface', async ({ page }) => {
+    await page.goto(BASE_URL)
+
+    await loadTestSurfImage(page)
+    await page.waitForTimeout(1000) // wait time to work around a bug
+
+    expect(await page.waitForSelector('canvas')).toBeTruthy()
+    expect(await page.$$('canvas')).toHaveLength(1)
+
+    await loadTestSurfImage(page)
+    expect(await page.$$('canvas')).toHaveLength(2)
+
+    expect(await page.textContent('text=/Number of Points: 40962/i')).toBeTruthy()
+  })
+
+  test('loads a test surface and overlay', async ({ page }) => {
+    await page.goto(BASE_URL)
+
+    await loadTestSurfImage(page)
+
+    await page.waitForTimeout(1000) // duplicated code to work around a bug
+    await loadTestSurfImage(page) // duplicated code to work around a bug
+
+    await loadTestSurfOverlay(page, 'curv')
+
+    await page.waitForTimeout(1000) // duplicated code to work around a bug
+    await loadTestSurfOverlay(page, 'curv') // duplicated code to work around a bug
+  })
+})
diff --git a/niivue/tests/LoadingTests.spec.ts b/niivue/tests/WithMessage.spec.ts
similarity index 79%
rename from niivue/tests/LoadingTests.spec.ts
rename to niivue/tests/WithMessage.spec.ts
index a4cf479..b7d9bbb 100644
--- a/niivue/tests/LoadingTests.spec.ts
+++ b/niivue/tests/WithMessage.spec.ts
@@ -1,7 +1,5 @@
 import { test, expect } from '@playwright/test'
-import { waitForDebugger } from 'inspector'
-
-const BASE_URL = 'http://localhost:4000/'
+import { BASE_URL, loadTestImage } from './utils'
 
 test.describe('app', () => {
   test('that there are 0 canvases when no image is loaded', async ({ page }) => {
@@ -66,25 +64,10 @@ test.describe('app', () => {
   })
 })
 
-async function loadTestImage(page) {
-  const testLink = 'https://niivue.github.io/niivue-demo-images/mni152.nii.gz'
-  // send a message to the app to load the test image
-  const message = {
-    type: 'addImage',
-    body: {
-      data: '',
-      uri: testLink,
-    },
-  }
-  await page.evaluate((m) => window.postMessage(m, '*'), message)
-}
-
 function listenForMessage(page) {
   const message = page.evaluate(() => {
     return new Promise((resolve) => {
       window.addEventListener('message', (event) => {
-        console.log(event)
-        console.log(event.data)
         if (event.data?.type == 'debugAnswer') resolve(event.data.body)
       })
     })
diff --git a/niivue/tests/example.spec.ts b/niivue/tests/example.spec.ts
deleted file mode 100644
index 4e2fc32..0000000
--- a/niivue/tests/example.spec.ts
+++ /dev/null
@@ -1,192 +0,0 @@
-import { test, expect } from '@playwright/test'
-
-const BASE_URL = 'http://localhost:4000/'
-
-test('has title', async ({ page }) => {
-  await page.goto('https://playwright.dev/')
-
-  // Expect a title "to contain" a substring.
-  await expect(page).toHaveTitle(/Playwright/)
-})
-
-test('get started link', async ({ page }) => {
-  await page.goto('https://playwright.dev/')
-
-  // Click the get started link.
-  await page.getByRole('link', { name: 'Get started' }).click()
-
-  // Expects page to have a heading with the name of Installation.
-  await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible()
-})
-
-test('adds 1 + 2 to equal 3', () => {
-  expect(1 + 2).toBe(3)
-})
-
-test.describe('app', () => {
-  test('adds 1 + 2 to equal 3', () => {
-    const expected = 3
-    expect(1 + 2).toBe(expected)
-  })
-
-  test('displays home screen', async ({ page }) => {
-    await page.goto(BASE_URL)
-
-    expect(await page.textContent('text=/Home/i')).toBeTruthy()
-    expect(await page.textContent('text=/Add Image/i')).toBeTruthy()
-    expect(await page.textContent('text=/View/i')).toBeTruthy()
-    expect(await page.textContent('text=/Bookmarklet/i')).toBeTruthy()
-    expect(await page.textContent('text=/Drop Files to load images/i')).toBeTruthy()
-  })
-
-  test('menubar updates with loading images', async ({ page }) => {
-    await page.goto(BASE_URL);
-
-    // initially only these menu items are visible
-    expect(await page.textContent('text=/Home/i')).toBeTruthy();
-    expect(await page.textContent('text=/Add Image/i')).toBeTruthy();
-    expect(await page.textContent('text=/View/i')).toBeTruthy();
-
-    // initially these menu items do not exist
-    expect(await page.$('text=/ColorScale/i')).toBeNull();
-    expect(await page.$('text=/Overlay/i')).toBeNull();
-    expect(await page.$('text=/Header/i')).toBeNull();
-    expect(await page.$('text=/Select/i')).toBeNull();
-
-    // load an image
-    await loadTestImage(page);
-    expect(await page.waitForSelector('canvas')).toBeTruthy();
-    expect(await page.textContent('text=/matrix size: 207 x 256 x 215, voxelsize: 0.74 x 0.74 x 0.74/i')).toBeTruthy();
-
-    // after loading an image these are visible
-    expect(await page.textContent('text=/Home/i')).toBeTruthy();
-    expect(await page.textContent('text=/Add Image/i')).toBeTruthy();
-    expect(await page.textContent('text=/View/i')).toBeTruthy();
-    expect(await page.textContent('text=/ColorScale/i')).toBeTruthy();
-    expect(await page.textContent('text=/Overlay/i')).toBeTruthy();
-    expect(await page.textContent('text=/Header/i')).toBeTruthy();
-
-    // the select menu item is only visible after loading 2 images
-    expect(await page.$('text=/Select/i')).toBeNull();
-    await loadTestImage(page);
-    expect(await page.textContent('text=/Select/i')).toBeTruthy();
-  });
-
-  test('loads a test image', async ({ page }) => {
-    await page.goto(BASE_URL)
-
-    await loadTestImage(page)
-
-    expect(await page.waitForSelector('canvas')).toBeTruthy();
-    expect(await page.$$('canvas')).toHaveLength(1);
-    expect(await page.textContent('text=/matrix size: 207 x 256 x 215, voxelsize: 0.74 x 0.74 x 0.74/i')).toBeTruthy();
-
-    await loadTestImage(page)
-    expect(await page.$$('canvas')).toHaveLength(2)
-  })
-
-  test('loads a test surface', async ({ page }) => {
-    await page.goto(BASE_URL);
-
-    await loadTestSurfImage(page);
-    await page.waitForTimeout(1000); // wait time to work around a bug
-
-    expect(await page.waitForSelector('canvas')).toBeTruthy();
-    expect(await page.$$('canvas')).toHaveLength(1);
-
-    await loadTestSurfImage(page);
-    expect(await page.$$('canvas')).toHaveLength(2);
-
-    expect(await page.textContent('text=/Number of Points: 40962/i')).toBeTruthy();
-  });
-
-  test('loads a test image and overlay', async ({ page }) => {
-    await page.goto(BASE_URL);
-
-    await loadTestSurfImage(page);
-
-    await page.waitForTimeout(1000); // duplicated code to work around a bug
-    await loadTestSurfImage(page); // duplicated code to work around a bug
-
-    await loadTestSurfOverlay(page, 'curv');
-
-    await page.waitForTimeout(1000); // duplicated code to work around a bug
-    await loadTestSurfOverlay(page, 'curv'); // duplicated code to work around a bug
-
-  });
-
-  test('loads an image and checks the menu bar', async ({ page }) => {
-    await page.goto(BASE_URL)
-
-    await loadTestImage(page)
-
-    expect(await page.waitForSelector('canvas')).toBeTruthy();
-    expect(await page.$$('canvas')).toHaveLength(1);
-    expect(await page.textContent('text=/matrix size: 207 x 256 x 215, voxelsize: 0.74 x 0.74 x 0.74/i')).toBeTruthy();
-
-    const menuBar = ['Home', 'Add Image', 'View', 'ColorScale', 'Overlay', 'Header']
-    for (const item of menuBar) {
-      expect(await page.textContent(`text=/${item}/i`)).toBeTruthy()
-    }
-  })
-
-  test('opens the example image via the menu bar', async ({ page }) => {
-
-    await page.goto(BASE_URL);
-
-    await page.click('data-testid=menu-item-dropdown-Add Image');
-    await page.click('text=/Example Image/i');
-
-    expect(await page.waitForSelector('canvas')).toBeTruthy();
-    expect(await page.$$('canvas')).toHaveLength(1);
-    expect(await page.textContent('text=/matrix size: 207 x 256 x 215, voxelsize: 0.74 x 0.74 x 0.74/i')).toBeTruthy();
-  });
-
-
-});
-
-async function loadTestImage(page) {
-  const testLink = 'https://niivue.github.io/niivue-demo-images/mni152.nii.gz'
-  // send a message to the app to load the test image
-  const message = {
-    type: 'addImage',
-    body: {
-      data: '',
-      uri: testLink,
-    },
-  }
-  await page.evaluate((m) => window.postMessage(m, '*'), message);
-}
-
-async function loadTestSurfImage(page) {
-  const testLink = 'https://niivue.github.io/niivue/images/BrainMesh_ICBM152.lh.mz3';
-  // send a message to the app to load the test image
-  const message = {
-    type: 'addImage',
-    body: {
-      data: '',
-      uri: testLink,
-    },
-  }
-  await page.evaluate((m) => window.postMessage(m, '*'), message);
-}
-
-async function loadTestSurfOverlay(page, file_type) {
-  let testLink;
-
-  if (file_type === 'curv') {
-    testLink = 'https://niivue.github.io/niivue/images/BrainMesh_ICBM152.lh.curv';
-  } else if (file_type === 'other') {
-    testLink = 'https://niivue.github.io/niivue/images/BrainMesh_ICBM152.lh.motor.mz3';
-  }
-  // send a message to the app to load the test image
-  const message = {
-    type: 'addMeshOverlay',
-    body: {
-      index: 0,
-      data: '',
-      uri: String(testLink),
-    },
-  }
-  await page.evaluate((m) => window.postMessage(m, '*'), message);
-}
diff --git a/niivue/tests/utils.ts b/niivue/tests/utils.ts
new file mode 100644
index 0000000..5d7de20
--- /dev/null
+++ b/niivue/tests/utils.ts
@@ -0,0 +1,47 @@
+export const BASE_URL = 'http://localhost:4000/'
+
+export async function loadTestImage(page) {
+  const testLink = 'https://niivue.github.io/niivue-demo-images/mni152.nii.gz'
+  // send a message to the app to load the test image
+  const message = {
+    type: 'addImage',
+    body: {
+      data: '',
+      uri: testLink,
+    },
+  }
+  await page.evaluate((m) => window.postMessage(m, '*'), message)
+}
+
+export async function loadTestSurfImage(page) {
+  const testLink = 'https://niivue.github.io/niivue/images/BrainMesh_ICBM152.lh.mz3'
+  // send a message to the app to load the test image
+  const message = {
+    type: 'addImage',
+    body: {
+      data: '',
+      uri: testLink,
+    },
+  }
+  await page.evaluate((m) => window.postMessage(m, '*'), message)
+}
+
+export async function loadTestSurfOverlay(page, file_type) {
+  let testLink
+
+  if (file_type === 'curv') {
+    testLink = 'https://niivue.github.io/niivue/images/BrainMesh_ICBM152.lh.curv'
+  } else if (file_type === 'other') {
+    testLink = 'https://niivue.github.io/niivue/images/BrainMesh_ICBM152.lh.motor.mz3'
+  }
+  // send a message to the app to load the test image
+  const message = {
+    type: 'addMeshOverlay',
+    body: {
+      index: 0,
+      data: '',
+      uri: String(testLink),
+    },
+  }
+  await page.evaluate((m) => window.postMessage(m, '*'), message)
+}