1

React を使用して作成された High Chart コンポーネントを使用しています。そのためのテストを作成する必要があり、インフラストラクチャは Jasmine/Karma/React TestUtils です。

私は次のコードを書きました：

const component: React.Component<{}, {}> = TestUtils.renderIntoDocument(
            <EmailActivityBreakdown trendData={trendData}/>
        );

私は一貫してError#13 http://www.highcharts.com/errors/13を取得しています(「EmailActivityBreakdown」オブジェクト内でチャートコンポーネントをインスタンス化するとき)。

通常、コンポーネントは正常に動作します (つまり、非テスト ケース モード)。ReactTest フレームワーク内で「renderTo」を使用してチャート要素を作成するにはどうすればよいですか?

ありがとう。

4

1 に答える 1

1

この場合の主な問題は、 の Karma サポートですgetElementById。High Chart は、次のようなコードを使用して EmailActivityBreakdown id を見つけます。

if (Fa(a)) this.renderTo = a = A.getElementById(a);

Karma テストがA.getElementById(a)返されている間null、このエラーが生成されるのはそのためです。現在、Karma で High Chart をテストするには、 が必要fixtureです。これはコード例です:

import React from 'react'
import TestUtils from 'react-addons-test-utils'

describe('(View) EmailActivityBreakdown', function () {

    beforeEach(function () {
        const fixture = '<div id="EmailActivityBreakdown"></div>'

        document.body.insertAdjacentHTML(
           'afterbegin',
           fixture)

        TestUtils.renderIntoDocument(<EmailActivityBreakdown 
            trendData={trendData}/>)
    })

    it('chart is rendered', function () {
       expect(document.getElementById('highcharts-0').innerHTML).to.exist
    })

})
于 2016-09-23T23:35:41.210 に答える