When using customHTMLRenderer to replace image, It report an error "Cannot read property 'walker' of undefined"

[richex-cn]

Describe the bug

When I repeat this operating, I got an error "Cannot read property 'walker' of undefined":

https://github.com/nhn/tui.editor/blob/master/apps/editor/docs/custom-html-renderer.md#skipchildren

To Reproduce

See https://codesandbox.io/s/tuieditor-bug-cannot-read-property-walker-of-undefined-et5cs?file=/src/App.vue

<template>
  <div id="app">
    <base-editor ref="tui" :options="$editorOptions" />
  </div>
</template>

<script>
import "codemirror/lib/codemirror.css";
import "@toast-ui/editor/dist/toastui-editor.css";

import { Editor as BaseEditor } from "@toast-ui/vue-editor";

export default {
  name: "App",
  components: { BaseEditor },

  created() {
    this.$editorOptions = {
      customHTMLRenderer: {
        image(node, context) {
          const { destination } = node;
          const { getChildrenText, skipChildren } = context;

          skipChildren();

          return {
            type: "openTag",
            tagName: "img",
            selfClose: true,
            attributes: {
              src: destination,
              alt: getChildrenText(),
            },
          };
        },
      },
    };
  },

  mounted() {
    const editor = this.$refs.tui.editor;
    editor.setMarkdown("Hello\n![](/logo.png)");
  },
};
</script>

Expected behavior

No error and normal work.

Screenshots

Desktop (please complete the following information):

• OS: Windows 10
• Browser Chrome
• Version 87.0.4280.141

[ats1999]

It also happens when we replace the heading tag.

[seonim-ryu]

@richex-cn Could you give this example code by making it CodeSandbox? I'll check and answer. I'm sorry I didn't see the code box at first.

[seonim-ryu]

@richex-cn @ats1999 Oops... the document was wrong. It should have been called by passing node to the getChildrenText function as a parameter. You can modify the code as follows. The documentation has been updated. Thanks for reporting the issue.

// ...

return {
  // ...
  attributes: {
    // ...
-  alt: getChildrenText(),
+  alt: getChildrenText(node),
  },
};