访问使用JSDOM创建的条形图的属性

时间:2018-07-17 09:24:33

标签: node.js jasmine jsdom

我正在学习jsdom以测试node.js中的可视化效果,但是无法访问使用jsdom创建的对象的属性。也许你可以帮我吗?

test.js:(这是我创建应进行测试的barChart的类)

let jsdom 

try {
  jsdom = require('jsdom/lib/old-api.js'); // jsdom >= 10.x
} catch (e) {
  jsdom = require('jsdom'); // jsdom <= 9.x
}

// wrapped in jsdom:
exports.barChart = function () {

 let barProperties;

  let bar = jsdom.env(
    '<html><body></body></html>', ['http://d3js.org/d3.v3.min.js'],
    function (err, window) {
      let svg = window.d3.select('body').append('svg')
        .attr('height', '500')
        .attr('width', '500')

      svg.append('rect')
        .attr('x', 10)
        .attr('y', 10)
        .attr('width', 80)
        .attr('height', 80)
        .style('fill', 'orange')

      barProperties = window.d3.select('body').html();
      console.log(barProperties);
    }
  )
  return bar;
}

barProperties产生输出:

<script class="jsdom" src="http://d3js.org/d3.v3.min.js"></script>
<svg height="500" width="500">
    <rect x="10" y="10" width="80" height="80" style="fill: orange;"></rect>
</svg>

test-spec.js:(在这里,我想从barProperties访问svg的“高度”属性)

let test = require('../../javascripts/test')
let jsdom

try {
  jsdom = require('jsdom/lib/old-api.js'); // jsdom >= 10.x
} catch (e) {
  jsdom = require('jsdom'); // jsdom <= 9.x
}

describe('Test d3 with jasmine', function () {

  describe('the svg', function () {

    it('should be created', function () {
      expect(getSvg().attr('height')).toBe('500'); <--- this doesn't work
    });
  });

  function getSvg () {

    test.barChart();
  }
})

错误消息:

TypeError: Cannot read property 'attr' of undefined

有没有办法从barProperties导出jsdom窗口对象?非常感谢!

0 个答案:

没有答案