Small issue: List showing nulls, not numbers, on render

[james-pratama]

On render, my lists are showing null instead of numbers. The numbers only show once I click the editor.

Tried adding ref to BlockNoteView to auto focus editor but does not seem to work.

Is there a list somewhere of all the properties taken by BlockNoteView?

[YousefED]

@james-pratama could you provide steps or a sandbox to reproduce this?

[gbfgamemiya]

I have the same problem.

It can also be found at the following URL example.

https://www.blocknotejs.org/examples/basic/all-blocks

( Line of Numbered List Item)

If you go back and forth between example > basic > (product line-up), number list item becomes null when out of focus

[rlancejohnson]

We also have this issue, and any help would be greatly appreciated. https://blog.opengtm.ai/how-strategic-territory-planning-can-boost-sales-performance

[jinho-kim-osd]

We have a same issue as well.

[Dadangdut33]

I have the same issue, i fix it temporarily using this trick:

useEffect(() => {
    let timeout: NodeJS.Timeout;
    if (editor) {
      timeout = setTimeout(() => {
        const firstBlock = editor.document[0];
        if (firstBlock) editor.updateBlock(firstBlock, { type: firstBlock.type });
      }, 100);
    }

    return () => {
      clearTimeout(timeout);
    };
  }, [editor]);

basically just update a block and it will not show as null after render

[kevinru2023]

I've encountered something similar as well, will try implementing temporary fix used by @Dadangdut33.

[matthewlipski]

Hi, haven't seen this issue before - if anyone can post steps to reproduce it that would be great!

[lamtuanamc]

@matthewlipski If you have multiple tabs using BlockNoteView, the numbered list will become null when you switch tabs. Additionally, when the BlockNoteView is in a non-editable state, the numbered list will also become null when you reload the page.

https://github.com/TypeCellOS/BlockNote/assets/37234239/2729b620-cc0c-494b-b70c-8f0b1599c640

[Dadangdut33]

if anyone can post steps to reproduce it that would be great!

Hope it helps, so basically:

1. Intialize blocknote with data
2. Render blocknote
3. null will be shown for data that is using list until you click on the editor (or do an edit programmatically)

[matthewlipski]

Thanks! Helps a lot, we'll look into it next time we do a bugfix release

[danlupascu]

I'm having the same issue, but with the generated HTML. All items will show up as null in the generated HTML.

[danlupascu]

We have fixed this issue by changing the numberedListItem in the schema, and adding the index prop:

const schema = BlockNoteSchema.create({
  blockSpecs: {
    // first pass all the blockspecs from the built in, default block schema
    ...defaultBlockSpecs,

    numberedListItem: {
      ...defaultBlockSpecs.numberedListItem,
      config: {
        ...defaultBlockSpecs.numberedListItem.config,
        propSchema: {
          ...defaultBlockSpecs.numberedListItem.config.propSchema,
          // add index to fix the null list number items
          index: {
            default: '',
          },
        },
      },
    },
  },
});

I think adding the index prop here should fix the issue https://github.com/TypeCellOS/BlockNote/blob/dce1d03a37234c3dd7ff85169e03ca8ace88ce82/packages/core/src/blocks/ListItemBlockContent/NumberedListItemBlockContent/NumberedListItemBlockContent.ts#L14

[tolypash]

I have the same issue when isEditable is false, on reload of page. When I click once, anywhere on the page it sets the numbers.