@heartlandone/vega 2.78.0 → 2.80.0

package/dist/collection/helpers/chart/test/input-processors/x-axis-label-formatter-input-processor.test.js

@@ -1,109 +0,0 @@
-import { XAxisLabelFormatterInputProcessor } from '../../input-processors/x-axis-label-formatter-input-processor';
-import { scaleTime } from '../../../../polyfill/d3';
-describe('xAxisLabelFormatterInputProcessor', () => {
-  const xAxisLabelFormatterInputProcessor = new XAxisLabelFormatterInputProcessor();
-  it('should not override the default scale formatter function when the type is not time or labelFormatter is not empty', () => {
-    const input = {
-      container: document.body,
-    };
-    const scale = scaleTime();
-    const formatMethod = scale['tickFormat'];
-    const prevOutput = {
-      scale,
-      start: { x: 0, y: 0 },
-      end: { x: 200, y: 0 },
-      tickSize: 10,
-      width: 200,
-      height: 150,
-    };
-    expect(xAxisLabelFormatterInputProcessor.process(input, prevOutput)['scale']['tickFormat']).toEqual(formatMethod);
-    expect(xAxisLabelFormatterInputProcessor.process(Object.assign(Object.assign({}, input), { xAxis: { type: 'time' } }), Object.assign(Object.assign({}, prevOutput), { labelFormatter: (date) => date.toDateString() }))['scale']['tickFormat']).toEqual(formatMethod);
-  });
-  it('should override the default scale formatter function when the type is time and the labelFormatter is not defined', () => {
-    const input = {
-      container: document.body,
-      xAxis: {
-        type: 'time',
-      },
-    };
-    const scale = scaleTime();
-    const formatMethod = scale['tickFormat'];
-    const prevOutput = {
-      scale,
-      start: { x: 0, y: 0 },
-      end: { x: 200, y: 0 },
-      tickSize: 10,
-      width: 200,
-      height: 150,
-    };
-    expect(xAxisLabelFormatterInputProcessor.process(input, prevOutput)['scale']['tickFormat'] ===
-      formatMethod).toBeFalsy();
-  });
-  it('should call the expect function when call the time formatter function', () => {
-    const mockXAxisLabelFormatterInputProcessor = new XAxisLabelFormatterInputProcessor();
-    const mockMillisecond = jest.fn((_date) => {
-      void _date;
-      return '';
-    });
-    const mockSecond = jest.fn((_date) => {
-      void _date;
-      return '';
-    });
-    const mockMinute = jest.fn((_date) => {
-      void _date;
-      return '';
-    });
-    const mockHour = jest.fn((_date) => {
-      void _date;
-      return '';
-    });
-    const mockDay = jest.fn((_date) => {
-      void _date;
-      return '';
-    });
-    const mockWeek = jest.fn((_date) => {
-      void _date;
-      return '';
-    });
-    const mockMonth = jest.fn((_date) => {
-      void _date;
-      return '';
-    });
-    const mockYear = jest.fn((_date) => {
-      void _date;
-      return '';
-    });
-    mockXAxisLabelFormatterInputProcessor['formatMillisecond'] = mockMillisecond;
-    mockXAxisLabelFormatterInputProcessor['formatSecond'] = mockSecond;
-    mockXAxisLabelFormatterInputProcessor['formatMinute'] = mockMinute;
-    mockXAxisLabelFormatterInputProcessor['formatHour'] = mockHour;
-    mockXAxisLabelFormatterInputProcessor['formatDay'] = mockDay;
-    mockXAxisLabelFormatterInputProcessor['formatWeek'] = mockWeek;
-    mockXAxisLabelFormatterInputProcessor['formatMonth'] = mockMonth;
-    mockXAxisLabelFormatterInputProcessor['formatYear'] = mockYear;
-    // millisecond: has ms
-    mockXAxisLabelFormatterInputProcessor['timeFormatter'](new Date('2023-03-02T00:00:00.100Z'));
-    expect(mockMillisecond).toBeCalledTimes(1);
-    // second: at second boundary but within a minute
-    mockXAxisLabelFormatterInputProcessor['timeFormatter'](new Date('2023-03-02T00:00:01.000Z'));
-    expect(mockSecond).toBeCalledTimes(1);
-    // minute: at minute boundary but within an hour
-    mockXAxisLabelFormatterInputProcessor['timeFormatter'](new Date('2023-03-02T00:01:00.000Z'));
-    expect(mockMinute).toBeCalledTimes(1);
-    // hour: at hour boundary but within a day
-    mockXAxisLabelFormatterInputProcessor['timeFormatter'](new Date('2023-03-02T01:00:00.000Z'));
-    expect(mockHour).toBeCalledTimes(1);
-    // day: at day boundary but not week boundary (Thu)
-    mockXAxisLabelFormatterInputProcessor['timeFormatter'](new Date('2023-03-02T00:00:00.000Z'));
-    expect(mockDay).toBeCalledTimes(1);
-    // week: at week boundary (Sun) but not month boundary
-    mockXAxisLabelFormatterInputProcessor['timeFormatter'](new Date('2023-03-05T00:00:00.000Z'));
-    expect(mockWeek).toBeCalledTimes(1);
-    // month: at month boundary but not year boundary
-    mockXAxisLabelFormatterInputProcessor['timeFormatter'](new Date('2023-02-01T00:00:00.000Z'));
-    expect(mockMonth).toBeCalledTimes(1);
-    // year: at year boundary
-    mockXAxisLabelFormatterInputProcessor['timeFormatter'](new Date('2023-01-01T00:00:00.000Z'));
-    expect(mockYear).toBeCalledTimes(1);
-  });
-});

package/dist/collection/helpers/chart/test/input-processors/y-axis-input-processor.coverage.test.js

@@ -1,39 +0,0 @@
-describe('YAxisInputProcessor - coverage-only branches', () => {
-  it('should fall back when polyfill returns undefined/empty', () => {
-    jest.isolateModules(() => {
-      const createdScales = [];
-      jest.doMock('../../../../polyfill/d3', () => {
-        const scaleLinear = jest.fn(() => {
-          const scale = {
-            domain: jest.fn(function () {
-              return this;
-            }),
-            range: jest.fn(function () {
-              return this;
-            }),
-            // intentionally no ticks()
-          };
-          createdScales.push(scale);
-          return scale;
-        });
-        return {
-          scaleLinear,
-          max: jest.fn(() => undefined),
-          min: jest.fn(() => undefined),
-          extent: jest.fn(() => [undefined, undefined]),
-        };
-      });
-      // eslint-disable-next-line @typescript-eslint/no-var-requires
-      const requiredModule = require('../../input-processors/y-axis-input-processor');
-      const processor = new requiredModule.YAxisInputProcessor();
-      const data = [{ x: 1, y: 0 }];
-      const result = processor['getScale'](data, [200, 0], 4);
-      expect(result.ticks).toBe(4);
-      expect(createdScales.length).toBe(2);
-      expect(createdScales[0].domain).toHaveBeenCalledWith([0, 0]);
-      expect(createdScales[1].domain).toHaveBeenCalledWith([0, 0]);
-      expect(createdScales[1].range).toHaveBeenCalledWith([200, 0]);
-    });
-  });
-});
-export {};

package/dist/collection/helpers/chart/test/input-processors/y-axis-input-processor.test.js

@@ -1,55 +0,0 @@
-import { YAxisInputProcessor } from '../../input-processors/y-axis-input-processor';
-describe('scaleGenerator', () => {
-  const yAxisInputProcessor = new YAxisInputProcessor();
-  it('should return expect result when call the getScale function', () => {
-    const numberData = [
-      { x: 1, y: 2 },
-      { x: 10, y: 20 },
-      { x: 11, y: 10 },
-    ];
-    const height = 200;
-    expect(yAxisInputProcessor['getScale'](numberData, [height, 0], 4).scale.range()).toEqual([
-      height,
-      0,
-    ]);
-    expect(yAxisInputProcessor['getScale'](numberData, [height, 0], 4).scale.domain()[0]).toEqual(0);
-  });
-  it('should expand domain/ticks when tick rounding excludes min/max', () => {
-    // Use values where the generated tick start/stop (based on a rounded step)
-    // does not include the data min/max, forcing both min and max adjustments.
-    const numberData = [
-      { x: 1, y: -125 },
-      { x: 2, y: 210 },
-    ];
-    const height = 200;
-    const result = yAxisInputProcessor['getScale'](numberData, [height, 0], 4);
-    const domain = result.scale.domain();
-    expect(domain[0]).toBeLessThanOrEqual(-125);
-    expect(domain[1]).toBeGreaterThanOrEqual(210);
-    expect(result.ticks).toBeGreaterThan(4);
-  });
-  // VD-992
-  it('should return the correct min data when call the getScale function', () => {
-    const numberData = [
-      { x: 2, y: -125 },
-      { x: 4, y: -15 },
-      { x: 6, y: 150 },
-      { x: 8, y: -15 },
-      { x: 20, y: -125 },
-    ];
-    const height = 200;
-    const minData = yAxisInputProcessor['getScale'](numberData, [height, 0], 4).scale.domain()[0];
-    expect(minData <= -125).toBeTruthy();
-  });
-  //VD-1041
-  it('should return the correct max data when call the getScale function', () => {
-    const numberData = [
-      { x: 'A', y: 210 },
-      { x: 'B', y: 25 },
-      { x: 'c', y: 205 },
-    ];
-    const height = 200;
-    const maxData = yAxisInputProcessor['getScale'](numberData, [height, 0], 4).scale.domain()[1];
-    expect(maxData >= 210).toBeTruthy();
-  });
-});

package/dist/collection/helpers/chart/test/interacting-entry-generator/arc-path-hover-generator.test.js

@@ -1,11 +0,0 @@
-import { ArcPathHoverGenerator } from '../../interacting-entry-generator/arc-path-hover-generator';
-describe('arcPathHoverGenerator', () => {
-  it('should get correct result when call the function using different parameters', () => {
-    const arcPathHoverGenerator = new ArcPathHoverGenerator();
-    const target = document.createElement('div');
-    const mouseEvent = new MouseEvent('click');
-    expect(arcPathHoverGenerator['shouldHandle'](Object.assign(Object.assign({}, mouseEvent), { target }))).toBeFalsy();
-    target.classList.add('vega-chart-arc-path');
-    expect(arcPathHoverGenerator['shouldHandle'](Object.assign(Object.assign({}, mouseEvent), { target }))).toBeTruthy();
-  });
-});

package/dist/collection/helpers/chart/test/interacting-entry-generator/pie-legend-hover-generator.test.js

@@ -1,25 +0,0 @@
-import { PieLegendHoverGenerator } from '../../interacting-entry-generator/pie-legend-hover-generator';
-describe('PieLegendHoverGenerator', () => {
-  it('should get correct result when call the function using different parameters', () => {
-    const hoverGenerator = new PieLegendHoverGenerator();
-    const currentTarget = document
-      .createElement('vega-pie-chart')
-      .appendChild(document.createElement('div'));
-    const target = currentTarget.appendChild(document.createElement('div'));
-    const mouseEvent = new MouseEvent('click');
-    expect(hoverGenerator['shouldHandle'](Object.assign(Object.assign({}, mouseEvent), { target, currentTarget }))).toBeFalsy();
-    target.classList.add('vega-chart-legend-item');
-    expect(hoverGenerator['shouldHandle'](Object.assign(Object.assign({}, mouseEvent), { target, currentTarget }))).toBeTruthy();
-    const mockTargetNoParent = document.createElement('div');
-    expect(hoverGenerator['shouldHandle'](Object.assign(Object.assign({}, mouseEvent), { target: mockTargetNoParent, currentTarget }))).toBeFalsy();
-  });
-  it('should get correct result when call the function using different parameters for line chart', () => {
-    const hoverGenerator = new PieLegendHoverGenerator();
-    const lineChart = document.createElement('vega-line-chart');
-    lineChart.attachShadow({ mode: 'open' });
-    const currentTarget = lineChart.shadowRoot.appendChild(document.createElement('div'));
-    const target = currentTarget.appendChild(document.createElement('div'));
-    const mouseEvent = new MouseEvent('click');
-    expect(hoverGenerator['shouldHandle'](Object.assign(Object.assign({}, mouseEvent), { target, currentTarget }))).toBeFalsy();
-  });
-});

package/dist/collection/helpers/chart/test/interactors/interactor-factory.test.js

@@ -1,19 +0,0 @@
-import { mockChartElement } from '../../../../utils/test-utils';
-import { CanvasInteractor } from '../../interactors/canvas-interactor';
-import { InteractorFactory } from '../../interactors/interactor-factory';
-import { SVGInteractor } from '../../interactors/svg-interactor';
-describe('renderer factory', () => {
-  beforeAll(() => {
-    mockChartElement();
-  });
-  it('should get correct result when input different context', () => {
-    let context = document.createElement('canvas');
-    expect(InteractorFactory.get(context) instanceof CanvasInteractor).toBeTruthy();
-    context = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    expect(InteractorFactory.get(context) instanceof SVGInteractor).toBeTruthy();
-    function testErrorContext() {
-      InteractorFactory.get(document.createElement('canvas_s'));
-    }
-    expect(testErrorContext).toThrow(new Error('Invalid context'));
-  });
-});

package/dist/collection/helpers/chart/test/interactors/svg-interactor.test.js

@@ -1,48 +0,0 @@
-import { mockChartElement } from '../../../../utils/test-utils';
-import { SVGInteractor } from '../../interactors/svg-interactor';
-describe('SVGInteractor', () => {
-  beforeAll(() => {
-    mockChartElement();
-  });
-  it('should get interactor entry correct when call the register method and unregister method', () => {
-    const mockSVGElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    mockSVGElement.innerHTML = '<g></g><text></text>';
-    const svgInteractor = new SVGInteractor(mockSVGElement);
-    const mockDrawer = {
-      drawPiece: mockSVGElement.querySelector('g'),
-    };
-    const drawPiece = mockDrawer.drawPiece;
-    const mockEntry = jest.fn();
-    const mockInteractingEntry = {
-      eventType: 'click',
-      shouldHandle: (_event) => !!_event,
-      handle: mockEntry,
-    };
-    svgInteractor.register(mockDrawer, drawPiece, mockInteractingEntry);
-    expect(svgInteractor['interactingEntryForEventRegistry'].get('click').length).toEqual(1);
-    expect(svgInteractor['interactingEntryForDrawerRegistry'].get(mockDrawer).get(drawPiece).length).toEqual(1);
-    const newDrawer = {
-      drawPiece: mockSVGElement.querySelector('text'),
-    };
-    svgInteractor.unregisterByDrawer(newDrawer);
-    expect(svgInteractor['interactingEntryForEventRegistry'].get('click').length).toEqual(1);
-    expect(svgInteractor['interactingEntryForDrawerRegistry'].has(mockDrawer)).toBeTruthy();
-    svgInteractor['callRegistry']('click', new MouseEvent('click'));
-    expect(mockEntry).toBeCalledTimes(1);
-    svgInteractor.unregisterByDrawer(mockDrawer);
-    expect(svgInteractor['interactingEntryForEventRegistry'].get('click').length).toEqual(0);
-    expect(svgInteractor['interactingEntryForDrawerRegistry'].has(mockDrawer)).toBeFalsy();
-  });
-  it('should call registry method when the context click or mouseover', () => {
-    const mockSVGElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    const svgInteractor = new SVGInteractor(mockSVGElement);
-    const mockRegistry = jest.fn();
-    svgInteractor['callRegistry'] = mockRegistry;
-    const clickEvent = new MouseEvent('click');
-    const overEvent = new MouseEvent('mouseover');
-    mockSVGElement.dispatchEvent(clickEvent);
-    expect(mockRegistry).toBeCalledWith('click', clickEvent);
-    mockSVGElement.dispatchEvent(overEvent);
-    expect(mockRegistry).toBeCalledWith('mouseover', overEvent);
-  });
-});

package/dist/collection/helpers/chart/test/line-chart.test.js

@@ -1,96 +0,0 @@
-import { mockChartElement } from '../../../utils/test-utils';
-import { LegendDrawer } from '../drawers/legend-drawer';
-import { PathDrawer } from '../drawers/path-drawer';
-import { XAxisDrawer } from '../drawers/x-axis-drawer';
-import { YAxisDrawer } from '../drawers/y-axis-drawer';
-import { LineChart } from '../line-chart';
-const TEST_BASE_LINE_OPTIONS = {
-  dataSource: [{ x: 0, y: 0 }],
-  layout: {
-    width: 100,
-    height: 100,
-    margin: {
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-    },
-  },
-  xAxis: {
-    labelFormatter: (d) => `${d}%`,
-  },
-  yAxis: {
-    labelFormatter: (d) => `$${d}`,
-  },
-  legends: ['Legend'],
-  container: null,
-};
-describe('LineChart', () => {
-  beforeAll(() => {
-    mockChartElement();
-  });
-  it('should run create drawer correct when new the class ', () => {
-    const lineChart = new LineChart(Object.assign({}, TEST_BASE_LINE_OPTIONS, { container: document.body }));
-    lineChart.render();
-    expect(lineChart['drawers'].length).toEqual(4);
-    expect(lineChart['drawers'][0] instanceof XAxisDrawer).toBeTruthy();
-    expect(lineChart['drawers'][1] instanceof YAxisDrawer).toBeTruthy();
-    expect(lineChart['drawers'][2] instanceof LegendDrawer).toBeTruthy();
-    expect(lineChart['drawers'][3] instanceof PathDrawer).toBeTruthy();
-  });
-  it('should run create drawer count correct when new the class', () => {
-    const lineChart = new LineChart({
-      dataSource: [[{ x: '2021-01-01', y: 0 }], [{ x: '2021-01-01', y: 10 }]],
-      container: document.body,
-    });
-    lineChart.render();
-    expect(lineChart['drawers'].length).toEqual(4);
-  });
-  it('should run createDrawerChain function when new the class', () => {
-    const lineChart = new LineChart({
-      dataSource: [{ x: '2021-01-01', y: 0 }],
-      container: document.body,
-      layout: TEST_BASE_LINE_OPTIONS.layout,
-    });
-    lineChart.render();
-    expect(lineChart['drawers'].length).toEqual(4);
-  });
-  it('should run createDrawerChain function normal when the layout margin is null', () => {
-    const lineChart = new LineChart({
-      dataSource: [{ x: '2021-01-01', y: 0 }],
-      container: document.body,
-    });
-    lineChart['options'] = {
-      dataSource: [{ x: '2021-01-01', y: 0 }],
-      container: document.body,
-      layout: null,
-    };
-    const mockSetLayout = jest.fn();
-    lineChart['renderer']['setLayout'] = mockSetLayout;
-    lineChart['setLayout']();
-    expect(mockSetLayout).toBeCalledWith(0, 0, 30, 30);
-  });
-  it('should clear the chart svg children when clear function run', () => {
-    const lineChart = new LineChart({
-      dataSource: [[{ x: '2021-01-01', y: 0 }]],
-      container: document.body,
-      layout: TEST_BASE_LINE_OPTIONS.layout,
-    });
-    lineChart.render();
-    expect(document.querySelectorAll('svg>g').length).toEqual(2);
-    lineChart.clear();
-    expect(document.querySelectorAll('svg>g').length).toEqual(0);
-  });
-  it('should update the chart when call the re render function ', () => {
-    const lineChart = new LineChart({
-      dataSource: [[{ x: '2021-01-01', y: 0 }]],
-      container: document.body,
-      layout: TEST_BASE_LINE_OPTIONS.layout,
-    });
-    const mockUpdate = jest.fn();
-    Object.assign(lineChart, { updateOptions: mockUpdate });
-    lineChart.reRender();
-    expect(mockUpdate).toBeCalledTimes(1);
-    expect(mockUpdate).toBeCalledWith(lineChart['options']);
-  });
-});

package/dist/collection/helpers/chart/test/pie-chart.test.js

@@ -1,38 +0,0 @@
-import { mockChartElement } from '../../../utils/test-utils';
-import { ArcPathDrawer } from '../drawers/arc-path-drawer';
-import { LegendDrawer } from '../drawers/legend-drawer';
-import { TextDrawer } from '../drawers/text-drawer';
-import { PieChart } from '../pie-chart';
-const TEST_BASE_OPTIONS = {
-  dataSource: [
-    { name: 'A', value: 100 },
-    { name: 'B', value: 50 },
-  ],
-  type: 'Pie',
-  legends: ['A', 'B'],
-  layout: {
-    width: 200,
-    height: 150,
-    margin: {
-      top: 0,
-      left: 0,
-      bottom: 0,
-      right: 0,
-    },
-  },
-};
-describe('PieChart', () => {
-  beforeAll(() => {
-    mockChartElement();
-  });
-  it('should run create drawer correct when new the class', () => {
-    const pieChart = new PieChart(Object.assign({}, TEST_BASE_OPTIONS, {
-      container: document.body,
-    }));
-    pieChart.render();
-    expect(pieChart['drawers'].length).toEqual(3);
-    expect(pieChart['drawers'][0] instanceof ArcPathDrawer).toBeTruthy();
-    expect(pieChart['drawers'][1] instanceof TextDrawer).toBeTruthy();
-    expect(pieChart['drawers'][2] instanceof LegendDrawer).toBeTruthy();
-  });
-});

package/dist/collection/helpers/chart/test/renderers/canvas-renderer.test.js

@@ -1,31 +0,0 @@
-import { CanvasRenderer } from '../../renderers/canvas-renderer';
-describe('canvas renderer', () => {
-  it('should set context layout when run the set layout function', () => {
-    const context = document.createElement('canvas');
-    const render = new CanvasRenderer(context);
-    const options = {
-      width: 300,
-      height: 200,
-      margin: { top: 10, left: 10, right: 10, bottom: 10 },
-    };
-    render.setLayout(options.width, options.height);
-    expect(context.tagName).toEqual('CANVAS');
-  });
-  it('should execute draw function when call the method', () => {
-    const mockRect = jest.fn();
-    const context = document.createElement('canvas');
-    context.getContext = jest.fn().mockReturnValue({
-      fillRect: mockRect,
-    });
-    const render = new CanvasRenderer(context);
-    const options = {
-      width: 300,
-      height: 200,
-      margin: { top: 10, left: 10, right: 10, bottom: 10 },
-    };
-    render.setLayout(options.width, options.height);
-    const position = { x: 0, y: 0 };
-    render.drawRect(position, 100, 50, 'bg-accent1-primary');
-    expect(mockRect).toBeCalledWith(position.x, position.y, 100, 50);
-  });
-});

package/dist/collection/helpers/chart/test/renderers/renderer-factory.test.js

@@ -1,19 +0,0 @@
-import { RendererFactory } from '../../renderers/renderer-factory';
-import { SVGRenderer } from '../../renderers/svg-renderer';
-import { CanvasRenderer } from '../../renderers/canvas-renderer';
-import { mockChartElement } from '../../../../utils/test-utils';
-describe('renderer factory', () => {
-  beforeAll(() => {
-    mockChartElement();
-  });
-  it('should get correct result when input different param', () => {
-    let context = document.createElement('canvas');
-    expect(RendererFactory.get(context) instanceof CanvasRenderer).toBeTruthy();
-    context = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    expect(RendererFactory.get(context) instanceof SVGRenderer).toBeTruthy();
-    function testErrorContext() {
-      RendererFactory.get(document.createElement('canvas_s'));
-    }
-    expect(testErrorContext).toThrow(new Error('Invalid context'));
-  });
-});

package/dist/collection/helpers/chart/test/renderers/svg-renderer.test.js

@@ -1,99 +0,0 @@
-import { SVGRenderer } from '../../renderers/svg-renderer';
-import { scaleLinear } from '../../../../polyfill/d3';
-describe('svg renderer', () => {
-  it('should set context layout when run the set layout function', () => {
-    const context = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    const render = new SVGRenderer(context);
-    const options = {
-      width: 300,
-      height: 200,
-      margin: { top: 10, left: 10, right: 10, bottom: 10 },
-    };
-    render.setLayout(options.width, options.height, options.margin.top, options.margin.left);
-    expect(context.getAttribute('width')).toEqual('300');
-    expect(context.getAttribute('height')).toEqual('200');
-    expect(context.getAttribute('viewBox')).toEqual('0,0,300,200');
-    expect(context.childNodes.length).toEqual(2);
-  });
-  it('should draw line when function call', () => {
-    const context = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    const render = new SVGRenderer(context);
-    const options = {
-      width: 300,
-      height: 200,
-      margin: { top: 10, left: 10, right: 10, bottom: 10 },
-    };
-    render.setLayout(options.width, options.height, options.margin.top, options.margin.left);
-    render.drawLine({ x: 0, y: 0 }, { x: 10, y: 11 }, '#1362E2');
-    const line = context.querySelector('line');
-    expect(line).not.toBeNull();
-    expect(line.getAttribute('x1')).toEqual('0');
-    expect(line.getAttribute('y1')).toEqual('0');
-    expect(line.getAttribute('x2')).toEqual('10');
-    expect(line.getAttribute('y2')).toEqual('11');
-  });
-  it('should draw rect when function call', () => {
-    const context = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    const render = new SVGRenderer(context);
-    const options = {
-      width: 300,
-      height: 200,
-      margin: { top: 10, left: 10, right: 10, bottom: 10 },
-    };
-    render.setLayout(options.width, options.height, options.margin.top, options.margin.left);
-    render.drawRect({ x: 0, y: 0 }, 150, 100, '#1362E2');
-    const rect = context.querySelector('rect');
-    expect(rect).not.toBeNull();
-    expect(rect.getAttribute('x')).toEqual('0');
-    expect(rect.getAttribute('y')).toEqual('0');
-    expect(rect.getAttribute('width')).toEqual('150');
-    expect(rect.getAttribute('height')).toEqual('100');
-  });
-  it('should draw rect when function call', () => {
-    const context = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    const render = new SVGRenderer(context);
-    const options = {
-      width: 300,
-      height: 200,
-      margin: { top: 10, left: 10, right: 10, bottom: 10 },
-    };
-    render.setLayout(options.width, options.height, options.margin.top, options.margin.left);
-    render.drawRect({ x: 0, y: 0 }, 150, 100, '#1362E2');
-    const rect = context.querySelector('rect');
-    expect(rect).not.toBeNull();
-    expect(rect.getAttribute('x')).toEqual('0');
-    expect(rect.getAttribute('y')).toEqual('0');
-    expect(rect.getAttribute('width')).toEqual('150');
-    expect(rect.getAttribute('height')).toEqual('100');
-  });
-  it('should draw text when function call', () => {
-    const context = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    const render = new SVGRenderer(context);
-    const options = {
-      width: 300,
-      height: 200,
-      margin: { top: 10, left: 10, right: 10, bottom: 10 },
-    };
-    render.setLayout(options.width, options.height, options.margin.top, options.margin.left);
-    render.drawText({ x: 0, y: 0 }, 'test', 'font-size:14px;font-weight:400;line-height:18px');
-    const text = context.querySelector('text');
-    expect(text).not.toBeNull();
-    expect(text.textContent).toEqual('test');
-    expect(text.getAttribute('x')).toEqual('0');
-    expect(text.getAttribute('y')).toEqual('0');
-  });
-  it('should render y axis normal when layout margin is undefined', () => {
-    const context = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-    const render = new SVGRenderer(context);
-    const options = {
-      width: 300,
-      height: 200,
-      margin: undefined,
-    };
-    render.setLayout(options.width, options.height, 0, 0);
-    const scale = scaleLinear();
-    render.drawYAxis({ scale, start: { x: 0, y: 0 }, end: { x: 0, y: 200 }, tickSize: 4, width: 300, height: 200 }, '#1362E2', 'font-size:14px;font-weight:400;line-height:18px');
-    const yAxisNode = context.querySelector('.vega-chart-y-axis');
-    expect(yAxisNode).not.toBeNull();
-  });
-});