diff --git a/__tests__/bugs/issue-2502-spec.ts b/__tests__/bugs/issue-2502-spec.ts new file mode 100644 index 00000000000..0fede29f8f8 --- /dev/null +++ b/__tests__/bugs/issue-2502-spec.ts @@ -0,0 +1,56 @@ +import { BidirectionalBar } from '../../src'; +import { createDiv, removeDom } from '../utils/dom'; + +describe('#2422', () => { + it('对称条形图 xAxis position 在 bottom 中间的时候,两个 view 都存在 axis', () => { + const div = createDiv('#2502: 对称条形图 axis'); + const data = [ + { country: '乌拉圭', '2016年耕地总面积': 13.4, '2016年转基因种植面积': 12.3 }, + { country: '巴拉圭', '2016年耕地总面积': 14.4, '2016年转基因种植面积': 6.3 }, + { country: '南非', '2016年耕地总面积': 18.4, '2016年转基因种植面积': 8.3 }, + { country: '巴基斯坦', '2016年耕地总面积': 34.4, '2016年转基因种植面积': 13.8 }, + { country: '阿根廷', '2016年耕地总面积': 44.4, '2016年转基因种植面积': 19.5 }, + { country: '巴西', '2016年耕地总面积': 24.4, '2016年转基因种植面积': 18.8 }, + { country: '加拿大', '2016年耕地总面积': 54.4, '2016年转基因种植面积': 24.7 }, + { country: '中国', '2016年耕地总面积': 104.4, '2016年转基因种植面积': 5.3 }, + { country: '美国', '2016年耕地总面积': 165.2, '2016年转基因种植面积': 72.9 }, + ]; + const plot = new BidirectionalBar(div, { + data, + width: 400, + height: 400, + layout: 'vertical', + xField: 'country', + yField: ['2016年耕地总面积', '2016年转基因种植面积'], + xAxis: { + position: 'top', + }, + yAxis: false, + }); + + plot.render(); + + expect(plot.chart.views[1].getController('axis').getComponents().length).toBe(0); + + plot.update({ xAxis: { position: 'bottom' } }); + const axes = plot.chart.views[1].getController('axis').getComponents(); + expect(axes.length).toBe(1); + + const view1XAxis = axes[0]; + // @ts-ignore + const labels = view1XAxis.component.getElementByLocalId('label-group').getChildren(); + expect(labels.length).toBe(data.length); + // view2 不展示 axis-label + expect(labels[0].attr('text')).toBe(''); + + const view0XAxis = plot.chart.views[0].getController('axis').getComponents()[0]; + // @ts-ignore + expect(view0XAxis.component.getElementByLocalId('label-group').getChildren()[0].attr('text')).not.toBe(''); + + // 除了 axis label, 其他保持一致 + expect(view1XAxis.component.get('tickLine')).toEqual(view0XAxis.component.get('tickLine')); + + plot.destroy(); + removeDom(div); + }); +});