Javascript 我们如何对使用DOM的函数进行单元测试？
您好，感谢您抽出时间阅读我的问题 我想问一下，因为我从Javascript的单元测试开始，我使用的是Jasmine/Karma 我正在尝试测试一个函数：Javascript 我们如何对使用DOM的函数进行单元测试？,javascript,unit-testing,Javascript,Unit Testing,您好，感谢您抽出时间阅读我的问题 我想问一下，因为我从Javascript的单元测试开始，我使用的是Jasmine/Karma 我正在尝试测试一个函数： export function setRenderer() { threeD = document.getElementById('container'); renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true,
export function setRenderer() {
threeD = document.getElementById('container');
renderer = new THREE.WebGLRenderer({
antialias: true,
alpha: true,
});
renderer.setSize(threeD.clientWidth, threeD.clientHeight);
let blueColor = 0x607d8b;
let alpha = 1;
renderer.setClearColor(blueColor, alpha);
threeD.appendChild(renderer.domElement);
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<title>AMI - Lesson 04</title>
<link rel="stylesheet" type="text/css" href="demo.css">
<script type="text/javascript" src="https://use.edgefonts.net/source-code-pro.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/dataarts/dat.gui/master/build/dat.gui.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/mrdoob/stats.js/master/build/stats.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/three.js/87/three.min.js"></script>
<!-- AMI -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/ami.js/0.0.22/ami.min.js"></script>
##
</head>
<body>
<div id="my-gui-container">
</div>
<div id="my-lut-container">
<div>CT
<div id="my-lut-canvases-l0" class="my-lut-canvases"></div>
</div>
<div>Segmentation
<div id="my-lut-canvases-l1" class="my-lut-canvases"></div>
</div>
</div>
<div id="container"></div>
<script src="stats.js"></script>
<script src="loader.js"></script>
<script src="handleSeries.js"></script>
<script src="scene.js"></script>
<script src="gui.js"></script>
<script src="dicomDataUrl.js"></script>
<script src="controls.js"></script>
<script src="camera.js"></script>
<script src="renderer.js"></script>
<script src="animator.js"></script>
<script type="text/javascript" src="demo.js"></script>
<!-- google analytics -->
</body>
</html>
/* globals describe, it, expect, beforeEach*/
import {setRenderer} from '../../lessons/04/renderer'
describe('Configuration', () => {
it('should true be true', () => {
expect(true).toBe(true);
});
});
describe('Renderer', () => {
it('should be created', () => {
var newDiv = document.createElement("div");
newDiv.id = 'container';
document.body.appendChild(newDiv);
setRenderer();
expect(document.getElementById('container').toBe(newDiv);
});
});
Configuration
V should true be true
Renderer
× should be created
ReferenceError: threeD is not defined
at setRenderer (mySpecs/lesson04/test.spec.js:101:12)
at UserContext.<anonymous> (mySpecs/lesson04/test.spec.js:88:90)
HeadlessChrome 0.0.0 (Windows 8.1 0.0.0): Executed 2 of 2 (1 FAILED) (0.033 secs / 0.011 secs)
TOTAL: 1 FAILED, 1 SUCCESS
1) should be created
Renderer
ReferenceError: threeD is not defined
at setRenderer (mySpecs/lesson04/test.spec.js:101:12)
at UserContext.<anonymous> (mySpecs/lesson04/test.spec.js:88:90)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
配置
V应该是真的
渲染器
应创建x
ReferenceError:未定义三个
在setRenderer（mySpecs/lesson04/test.spec.js:101:12）
在UserContext
渲染器功能：
index.html
感谢您花时间阅读此问题
Configuration
V should true be true
Renderer
× should be created
ReferenceError: threeD is not defined
at setRenderer (mySpecs/lesson04/test.spec.js:101:12)
at UserContext.<anonymous> (mySpecs/lesson04/test.spec.js:88:90)
HeadlessChrome 0.0.0 (Windows 8.1 0.0.0): Executed 2 of 2 (1 FAILED) (0.033 secs / 0.011 secs)
TOTAL: 1 FAILED, 1 SUCCESS
1) should be created
Renderer
ReferenceError: threeD is not defined
at setRenderer (mySpecs/lesson04/test.spec.js:101:12)
at UserContext.<anonymous> (mySpecs/lesson04/test.spec.js:88:90)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
HeadlessChrome 0.0.0 (Windows 8.1 0.0.0): Executed 2 of 2 (1 FAILED) (0.034 secs / 0.013 secs)
TOTAL: 1 FAILED, 1 SUCCESS
1) should be created
Renderer
ReferenceError: threeD is not defined
at setRenderer (mySpecs/lesson04/test.spec.js:101:12)
at UserContext.<anonymous> (mySpecs/lesson04/test.spec.js:88:90)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.