Bullet list not recognized on load


I use this schema:

import { Schema } from 'prosemirror-model';
import { addListNodes, bulletList, listItem, orderedList } from 'prosemirror-schema-list';
import { em, li, ol, strong, ul, underline } from './marks';
import { doc, text, paragraph } from './nodes';

type Marks = 'ul' | 'ol' | 'li' | 'em' | 'strong' | 'underline';
type Nodes = 'doc' | 'bulletList' | 'orderedList' | 'listItem' | 'text' | 'paragraph';

const localSchema = new Schema<Nodes, Marks>({
    nodes: { doc, bulletList, orderedList, listItem, text, paragraph },
    marks: { ul, ol, li, em, strong, underline },

export const mySchema = new Schema({
    nodes: addListNodes(localSchema.spec.nodes, 'paragraph block*', 'block'),
    marks: localSchema.spec.marks,

The mark for ul is very basic:

export const ul: MarkSpec = {
    parseDOM: [{ tag: 'ul' }],
    toDOM: () => ['ul', 0],

Everything works fine, I can create and toggle lists in the editor. However, if I have a ul in the initial HTML (on load), ór if I paste a ul into the editor, it is not recognized as such (although it is displayed as such).

If I put the cursor somewhere in the list, the list menu button is not displayed as active, and if I press the button, a second bullet is added.

I think it is because the ul is wrapped in a paragraph on load.

What am I doing wrong?

Why are you defining a mark for <ul> elements? That’s used by bullet lists, and the parse rule for your mark will likely mess with that.

Well, if I leave out the mark the <ul> is not shown in the editor… Marks for bullet lists and list items are not exported in the schema-list repo, are they?

Why are you defining localSchema (with the list nodes in it under the wrong names) and then using addListNodes on that to add them again? That likely has something to do with the issue.

1 Like

That was it. Thanks for the quick response.