在不重新排序属性的情况下获取HTML

Question

我正在使用测试驱动开发来测试一些JS功能。

这是JS

CardReader.prototype.lockDevice = function() {
    this._buttonElement.disabled = true;
    this._statusElement.innerHTML = " ";
    this._statusElement.innerHTML = 'Waiting for NFC card <img id="image" alt="Waiting" src="/img/waiting.gif" height="16" width="16">';
    this._hardwareAccessor.lockDeviceRequest(this.lockDeviceCallback, this);
};

这是测试：

CardReaderTestCase.prototype.assertWaitingMessageIsAsExpected = function() {
    assertEquals('Waiting for NFC card <img id="image" alt="Waiting" src="/img/waiting.gif" height="16" width="16" />', this.statusElement.innerHTML);
};

但是当我运行测试时，结果是属性宽度和高度已重新排序到开头，使断言失败。

有没有办法在不混淆属性的情况下抓取HTML？

Answer 1

没有保证的属性顺序，您正在处理XML的序列化。您应该只检查所需的属性，例如图像宽度。

CardReaderTestCase.prototype.assertWaitingMessageIsAsExpected = function() {
    assertEquals(this.statusElement.childNodes[1].width, 16);
    // Even check the HTML but be more relaxed
    assertEquals(this.statusElement.innerHTML.indexOf("Waiting for NFC card"), 0);
}