fix: fix passing a single Node to mermaid.init()

Passing a single Node to mermaid.init() results in an error, as it
calls `new NodeList()`, which causes `TypeError: Illegal constructor`.

See 5597cf45bf/src/mermaid.ts (L73)

If we instead use the `ArrayLike` interface, we can just use a simple
array, instead of a NodeList.

I've also added a basic test case, by mocking the `mermaidAPI.render()`
function so it isn't called, as the d3 functions don't work in Node.JS.
The mocks are a bit messy, since
 a) Jest doesn't fully support ESM yet, and
 b) mermaidAPI is frozen with `Object.freeze()`,
but the mermaidAPI mocks work as long as we keep them simple.

Fixes: c68ec54fdd
This commit is contained in:
Alois Klink
2022-09-02 04:28:22 +01:00
parent 5597cf45bf
commit b3c0c57c6d
3 changed files with 67 additions and 3 deletions

View File

@@ -1,4 +1,5 @@
import mermaid from './mermaid';
import { mermaidAPI } from './mermaidAPI';
import flowDb from './diagrams/flowchart/flowDb';
import flowParser from './diagrams/flowchart/parser/flow';
import flowRenderer from './diagrams/flowchart/flowRenderer';
@@ -6,6 +7,13 @@ import Diagram from './Diagram';
const spyOn = jest.spyOn;
// mocks the mermaidAPI.render function (see `./__mocks__/mermaidAPI`)
jest.mock('./mermaidAPI');
afterEach(() => {
jest.restoreAllMocks();
});
describe('when using mermaid and ', function () {
describe('when detecting chart type ', function () {
it('should not start rendering with mermaid.startOnLoad set to false', function () {
@@ -40,6 +48,16 @@ describe('when using mermaid and ', function () {
});
});
describe('when using #initThrowsErrors', function () {
it('should accept single node', async () => {
const node = document.createElement('div');
node.appendChild(document.createTextNode('graph TD;\na;'));
mermaid.initThrowsErrors(undefined, node);
expect(mermaidAPI.render).toHaveBeenCalled();
});
});
describe('when calling addEdges ', function () {
beforeEach(function () {
flowParser.parser.yy = flowDb;