Page template glitch with a mysterious empty pixel image

Technical Questions
,
1

Builder content link
e.g. Builder.io: Visual Development Platform

Builder public api key
1d8ecee591ac4358befb8fe998100548

What are you trying to accomplish
Whenever I am trying to create a new page via template, a Builderblock would show up at the bottom of the page, and this is a 0 by 0 empty pixel. This shows up in our production and also local. The empty pixel blocks our interaction to edit, add or remove content on the page.

Screenshots or video link

Code stack you are integrating Builder with
NextJs

Reproducible code example
the empty pixel is not in our codebase.

2

Here is my Builder config:

import type { Input, Component } from '@builder.io/sdk';

export const BlogDetailInputs: Input[] = [
  {
    name: 'extraSideNavigation',
    friendlyName: 'Additional Side menu',
    helperText: 'Additional side menu items',
    type: 'uiBlocks',
    hideFromUI: true,
    defaultValue: [
      {
        '@type': '@builder.io/sdk:Element',
        component: {
          name: 'Symbol',
          options: {
            symbol: {
              model: 'symbol',
              entry: '86e1e0ed28b546ff9e45b1ce619972bd',
            },
          },
        },
      },
    ],
  },
  {
    name: 'crossPromotions',
    type: 'uiBlocks',
    hideFromUI: true,
    defaultValue: [
      {
        '@type': '@builder.io/sdk:Element',
        component: {
          name: 'Symbol',
          options: {
            symbol: {
              model: 'symbol',
              entry: '3ef90249c11e415ab226e7cfbfddaa63',
            },
          },
        },
      },
      ,
    ],
  },
];

export const BlogDetailComponent: Component = {
  name: 'BlogDetail',
  friendlyName: 'Blog Detail',
  image:
    'https://cdn.builder.io/api/v1/image/assets%2F1d8ecee591ac4358befb8fe998100548%2Fb774601b3c5d4363a7239465e26b5db4',
  inputs: BlogDetailInputs,
  canHaveChildren: true,
  models: ['blog-detail'],
  childRequirements: {
    message: 'You can only put components under "Basics" inside a Blog Detail',
    query: {
      'component.name': {
        $in: [
          'Bullets',
          'dsButton',
          'Form',
          'FormButton',
          'DS Heading',
          'dsImage',
          'Paragraph',
          'Text',
          'Video',
          'videoButton',
          'videButton',
          'VideoEmbed',
        ],
      },
    },
  },
};
3

Hello @tlee-pb,

Thank you for bringing this issue to our attention. We wanted to let you know that we’ve been able to reproduce the problem on our end as well, and we fully understand the impact it’s having.

Our engineering team has already been notified, and we have raised the issue with them as a potential bug. They are actively investigating the root cause and working on a solution.

We understand how important this is to you, and we will make sure to keep you updated with any progress or new developments as soon as we have more information.

Thank you for your patience and understanding as we work to resolve this.

Regards,

4

@builder_akash

Hello, some update this glitch. Right now, the empty img block does not block users from editing the page, but it still appears whenever we use this template.

5

Hello @tlee-pb,

We are discussing this issue internally, and we will be sure to keep you updated as soon as we make any progress.

Thanks for your cooperation!