Persist Custom ID Attributes in Quilljs

Question

We need to persist ID attributes for every div that we create on a new line. We tried saving quill delta in the localstorage and when tried to set using setContents() the IDs are changed. When we try to insert a new Delta or text it is creating new random IDs.

import Quill from 'quill';
import {v4 as UUID4} from 'uuid';
const Parchment = Quill.import('parchment');
const IDAttribute = new Parchment.Attributor.Attribute('id-attribute', 'id', {
  scope: Parchment.Scope.BLOCK,
});
Quill.register(
  {
    'attributors/attribute/id': IDAttribute,
  },
  true
);

Quill.register(
  {
    'formats/id': IDAttribute,
  },
  true
);

const Block = Quill.import('blots/block');
const Delta = Quill.import('delta');
Block.tagName = 'p';
Quill.register(Block, true);
class BlockBlot extends Block {
  constructor(domNode) {
    super(domNode);
    domNode.setAttribute('id', UUID4());
    console.log(Delta(BlockBlot))
    this.cache = {};
  }
}

BlockBlot.blotName = 'block';

export default BlockBlot;

import Block from "./QuillHelpers/test"
Quill.register('formats/block', Block );

Is this the correct way to add custom attributes and persist them in quill?

Framework: React 17 react-quill: 1.3.5