undefined 不是 PhantomJS 上 Mocha / Chai / Sinon 的构造函数 Array.prototype.find

Question

我现在对此非常头疼。我在尝试测试的方法中有一行代码，无论我做什么我都无法通过。有用！在'the real world'.

中没有任何问题

我发现每次我深入研究 JS 单元测试时都会遇到这样的障碍，这让我怀疑它是否真的值得。

这是我要测试的方法...

    _mapStopsAroundHub(managerContext, soCode, homePostcode, homeStops, changeLinkedStopCallback) {
    homeStops = homeStops || [];
    MappingDataGateway.getNearbyStops(soCode, homePostcode, Cfg.DefaultNearbyStopDistance, (stops, status, xhr) => {
        if(status == MappingDataGateway.Status.OK) {
            stops.forEach((element) => {
                let isHomeStop = homeStops.length > 0 && (homeStops.find(hs => hs.id === element.id) !== undefined);
                let markerColor = isHomeStop ? "green" : "orange";
                let marker = managerContext.addBusStopMarker(element, markerColor);
                if (changeLinkedStopCallback) {
                    managerContext._api.event.addListener(marker, 'click', () => {
                        let newIcon = marker.icon.includes("orange") ? `/images/fa-bus-green.png` : `/images/fa-bus-orange.png`;
                        marker.setIcon(newIcon);
                        changeLinkedStopCallback(marker.data);
                    })
                }
            });
        }
        else if (errorCallback) { errorCallback(xhr); }
    });
}

我已经添加了 'isHomeStop' 变量和完全不必要的 homeSTops.length 检查以使一些测试用例通过，但我无法测试 homeStops 数组包含 Mocha 数据的情况跌倒了它非常有用的错误消息 'undefined is not a constructor' 类型的消息。完整错误如下...

PhantomJS 2.1.1 (Windows 8 0.0.0) MapsManager can interract with a loaded map to map the stops around a hub point directly with a linked stop mapping all selectable stops in the area showing selected linked stops in a different colour FAILED undefined is not a constructor (evaluating 'homeStops.find(function (hs) { return hs.id === element.id; })')

失败的测试看起来像这样...

  it("directly with a linked stop mapping all selectable stops in the area showing selected linked stops in a different colour", () => {
            let allStops = [{ id: 1 }, { id: 2 }, { id: 3 }];
            let homeStops = [{ id: 2 }];
            let mappingDataStub = Sinon.stub(MappingDataGateway, 'getNearbyStops');
            mappingDataStub.yields(allStops, "OK");
            let addMarkerStub = Sinon.stub(objUt, 'addBusStopMarker');

            objUt._mapStopsAroundHub(objUt, testSoCode, testPostCode, homeStops);
            mappingDataStub.restore();
            addMarkerStub.restore();

            Sinon.assert.calledThrice(addMarkerStub);
            Sinon.assert.calledWith(addMarkerStub, allStops[0], "orange");
            Sinon.assert.calledWith(addMarkerStub, allStops[1], "green");
            Sinon.assert.calledWith(addMarkerStub, allStops[2], "orange");
        });

我在代码中放置了未定义的检查来检查对象的状态，它就在那里 - 它似乎落在 find 中的 lambda 表达式上。

附加信息：这似乎只发生在 PhantomJS 上 - 如果我使用 Chrome 一切都运行良好（尽管这不是一个可行的 CI 选项！）。

Answer 1

这似乎是 PhantomJS 的问题。

我通过从这里应用 PhantomJS polyfil 来修复它...

https://www.npmjs.com/package/phantomjs-polyfill-find

（糟透了....）

Answer 2

PhantomJS 可能不支持 Array.prototype.find。在测试助手文件中添加一个 polyfill，它将解决您的问题。 Polyfill on MDN

Answer 3

试试 latest version 2.5b，它有一个 up-todate Webkit abd 完全支持 ES6。

undefined 不是 PhantomJS 上 Mocha / Chai / Sinon 的构造函数 Array.prototype.find

undefined is not a constructor in Mocha / Chai / Sinon on PhantomJS with Array.prototype.find

javascript

mocha.js

phantomjs

chai

ecmascript-6