如何在 Polymer 中测试服务?
How do I test services in polymer?
我正在编写一个聚合物应用程序并有一个由聚合物元素使用的服务。我想测试这项服务,但不知道如何做。
这是我在服务中的内容:
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
<script src="../../web-component-tester/browser.js"></script>
<link rel="import" href="../test-service.html">
<script>
define('test-service', () => {
class TestService {
constructor(componentA, componentB) {
this.componentA = componentA;
this.componentB = componentB;
}
}
return TestService;
});
</script>
我该如何测试?如果我尝试简单地包含 .html 文件,我将无法访问 TestService.
这是示例测试的完整 html。基本上通过 test-fixture
添加您的测试服务标签,然后查看它是否正常工作。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
<title>test-service test</title>
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
<script src="../../web-component-tester/browser.js"></script>
<link rel="import" href="../test-service.html">
</head>
<body>
<test-fixture id="BasicTestFixture">
<template>
<test-service></test-service>
</template>
</test-fixture>
<script>
suite('test-service', function() {
test('instantiating the element with default properties works', function() {
let testService = fixture('BasicTestFixture');
assert.equal(testService.apiUrl, 'http://myapi.domain.com');
// possible something like
// let addResult = testService.addElement(...);
// assert.equals(addResult, '{"result": "success"}');
});
});
</script>
</body>
</html>
终于想通了。这一切都与 Polymer IMD 和依赖注入有关。定义测试套件看起来与它不同:
define('test-service-test', ['test-service'], (TestService) => {
let testServiceInstance = new TestService(1, 2);
test('basic test', function(){
assert.equal(testServiceInstance.componentA, 1);
assert.equal(testServiceInstance.componentB, 2);
})
});
我正在编写一个聚合物应用程序并有一个由聚合物元素使用的服务。我想测试这项服务,但不知道如何做。
这是我在服务中的内容:
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
<script src="../../web-component-tester/browser.js"></script>
<link rel="import" href="../test-service.html">
<script>
define('test-service', () => {
class TestService {
constructor(componentA, componentB) {
this.componentA = componentA;
this.componentB = componentB;
}
}
return TestService;
});
</script>
我该如何测试?如果我尝试简单地包含 .html 文件,我将无法访问 TestService.
这是示例测试的完整 html。基本上通过 test-fixture
添加您的测试服务标签,然后查看它是否正常工作。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
<title>test-service test</title>
<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
<script src="../../web-component-tester/browser.js"></script>
<link rel="import" href="../test-service.html">
</head>
<body>
<test-fixture id="BasicTestFixture">
<template>
<test-service></test-service>
</template>
</test-fixture>
<script>
suite('test-service', function() {
test('instantiating the element with default properties works', function() {
let testService = fixture('BasicTestFixture');
assert.equal(testService.apiUrl, 'http://myapi.domain.com');
// possible something like
// let addResult = testService.addElement(...);
// assert.equals(addResult, '{"result": "success"}');
});
});
</script>
</body>
</html>
终于想通了。这一切都与 Polymer IMD 和依赖注入有关。定义测试套件看起来与它不同:
define('test-service-test', ['test-service'], (TestService) => {
let testServiceInstance = new TestService(1, 2);
test('basic test', function(){
assert.equal(testServiceInstance.componentA, 1);
assert.equal(testServiceInstance.componentB, 2);
})
});