Buggy behaviour in Chrome

I was attempting to create a section for my homepage. The visual editor is not behaving.

Builder content link

Builder public api key
d9a9ca76e71742dcbbc918da9ba7ba3a

What are you trying to accomplish
I am trying to use the visual editor. It is not responding to any items that I add to the canvas. I have to keep refreshing the screen. Not a great experience.

Screenshots or video link

Code stack you are integrating Builder with
Nuxt3

Reproducible code example
I have lifted this from the docs.

<template>
  <div id="home">
    <div>Hello world from your Nuxt 3 project. Below is Builder Content:</div>
    <div v-if="canShowContent">
      <div>
        Page title:
        {{ (content?.data?.title) || 'Unpublished' }}
      </div>
      <Content
          :model="page"
          :content="content"
          :api-key="apiKey"
      />
    </div>
    <div v-else>Content not Foundsss</div>
  </div>
</template>

<script setup>
import { ref, computed } from 'vue';
import { useRoute } from 'vue-router';
import { Content, isPreviewing, fetchOneEntry, getBuilderSearchParams } from '@builder.io/sdk-vue';

const runtimeConfig = useRuntimeConfig()
const apiKey = runtimeConfig.public.builderIoKey;

const route = useRoute();
const urlPath = computed(() => `/\$\{route.params.slug.join('/')\}`);
const content = ref(null);
const canShowContent = ref(false);

// Fetch the Builder content for the page that matches the URL path
try {
  const response = await fetchOneEntry({
    model: 'homepage',
    apiKey,
    userAttributes: {
      urlPath: urlPath.value,
    },
    options: getBuilderSearchParams(route.query)
  });
  content.value = response;
  canShowContent.value = content.value || isPreviewing();
} catch (error) {
  console.error('Builder content not found:', error);
  if (process.server) {
    // Set the HTTP response status code to 404 if no content is found
    const nuxtApp = useNuxtApp();
    nuxtApp.ssrContext.event.res.statusCode = 404;
  }
}
</script>