[Question] How to add "Ordered/Unordered List" option in rte/custom block

Hi

I’m trying to create an ordered list with grapesjs. I tried adding the following to the rte:

editor.RichTextEditor.add('orderedList',
{
  icon: '1.',
  attributes: {title: 'Ordered List'},
  result: rte => rte.exec('insertOrderedList')
});

And this works if my page is pre-filled with html when the editor is initialized, like below:

Prefilled Editor:

Create Ordered List:

If, however, I drop a new block into the canvas, and then press the ordered list button, I get a NS_ERROR_ILLEGAL_VALUE message, like below:

Create new Paragraph Block:

Create Ordered List:

How can I fix this so that:

1. we can insert lists in newly created blocks? (Side Note: My example shows me doing this through the rte toolbar, but I am open to making lists into a new block type, if that helps and someone can tell me how to make them work.)
2. we can indent lists to create multilevel bullets (currently the indent command via the rte also does not work on new blocks, possibly for the same reasons above)
3. (Optionally) we can use the tab key to indent the lists?

[thomas1204]

From the above comments, I can now add ordered and unordered list. Is there any way to update existing ordered and unordered List ?

@artf @rahuloftheramaneffect

[josfh2005]

Oh! Sorry. Here’s the online version: https://jsfiddle.net/qnj1mhkt/

This seems to be a problem with de P tag. With the default text inside the div, works fine in firefox.