Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit ded8d0e

Browse filesBrowse files
haoqunjianghaoqunjiang
committed
test: more advanced & edge case tests
1 parent a56585e commit ded8d0e
Copy full SHA for ded8d0e

File tree

Expand file treeCollapse file tree

9 files changed

+276
-21
lines changed
Filter options
Expand file treeCollapse file tree

9 files changed

+276
-21
lines changed

‎package.json

Copy file name to clipboardExpand all lines: package.json
+4Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,13 +57,16 @@
5757
"memfs": "^3.1.2",
5858
"mini-css-extract-plugin": "^0.11.2",
5959
"normalize-newline": "^3.0.0",
60+
"null-loader": "^4.0.1",
6061
"prettier": "^2.1.1",
6162
"pug": "^2.0.0",
6263
"pug-plain-loader": "^1.0.0",
64+
"source-map": "^0.6.1",
6365
"style-loader": "^1.2.1",
6466
"stylus": "^0.54.7",
6567
"stylus-loader": "^3.0.2",
6668
"ts-jest": "^26.2.0",
69+
"ts-loader": "^8.0.6",
6770
"typescript": "^4.0.2",
6871
"url-loader": "^4.1.0",
6972
"vue": "^3.0.0-rc.10",
@@ -75,6 +78,7 @@
7578
},
7679
"jest": {
7780
"preset": "ts-jest",
81+
"testTimeout": 10000,
7882
"testEnvironment": "node",
7983
"testPathIgnorePatterns": [
8084
"<rootDir>/dist/",

‎test/advanced.spec.ts

Copy file name to clipboardExpand all lines: test/advanced.spec.ts
+79-8Lines changed: 79 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,87 @@
1-
test.todo('support chaining with other loaders')
1+
import { SourceMapConsumer } from 'source-map'
2+
import { fs as mfs } from 'memfs'
3+
import { bundle, mockBundleAndRun } from './utils'
24

3-
test.todo('inherit queries on files')
5+
test('support chaining with other loaders', async () => {
6+
const { componentModule } = await mockBundleAndRun({
7+
entry: 'basic.vue',
8+
modify: (config) => {
9+
config!.module!.rules[0] = {
10+
test: /\.vue$/,
11+
use: ['vue-loader', require.resolve('./mock-loaders/js')],
12+
}
13+
},
14+
})
415

5-
test.todo('expose file path as __file outside production')
16+
expect(componentModule.data().msg).toBe('Changed!')
17+
})
618

7-
test.todo('no __file in production when exposeFilename disabled')
19+
test.skip('inherit queries on files', async () => {
20+
const { componentModule } = await mockBundleAndRun({
21+
entry: 'basic.vue?change',
22+
modify: (config) => {
23+
config!.module!.rules[0] = {
24+
test: /\.vue$/,
25+
use: ['vue-loader', require.resolve('./mock-loaders/query')],
26+
}
27+
},
28+
})
829

9-
test.todo(
10-
'expose file basename as __file in production when exposeFilename enabled'
11-
)
30+
expect(componentModule.data().msg).toBe('Changed!')
31+
})
1232

13-
test.todo('source map')
33+
test('expose file path as __file outside production', async () => {
34+
const { componentModule } = await mockBundleAndRun({
35+
entry: 'basic.vue',
36+
})
37+
38+
expect(componentModule.__file).toBe('test/fixtures/basic.vue')
39+
})
40+
41+
test('no __file in production when exposeFilename disabled', async () => {
42+
const { componentModule } = await mockBundleAndRun({
43+
mode: 'production',
44+
entry: 'basic.vue',
45+
})
46+
47+
expect(componentModule.__file).toBe(undefined)
48+
})
49+
50+
test('expose file basename as __file in production when exposeFilename enabled', async () => {
51+
const { componentModule } = await mockBundleAndRun({
52+
mode: 'production',
53+
entry: 'basic.vue',
54+
vue: {
55+
exposeFilename: true,
56+
},
57+
})
58+
expect(componentModule.__file).toBe('basic.vue')
59+
})
60+
61+
test.skip('source map', async () => {
62+
const { code } = await bundle({
63+
entry: 'basic.vue',
64+
devtool: 'source-map',
65+
})
66+
const map = mfs.readFileSync('/test.build.js.map', 'utf-8')
67+
const smc = new SourceMapConsumer(JSON.parse(map as string))
68+
let line = 0
69+
let col = 0
70+
const targetRE = /^\s+msg: 'Hello from Component A!'/
71+
code.split(/\r?\n/g).some((l, i) => {
72+
if (targetRE.test(l)) {
73+
line = i + 1
74+
col = 0
75+
return true
76+
}
77+
})
78+
const pos = smc.originalPositionFor({
79+
line: line,
80+
column: col,
81+
})
82+
expect(pos.source.indexOf('basic.vue') > -1)
83+
expect(pos.line).toBe(9)
84+
})
1485

1586
test.todo('extract CSS')
1687

‎test/edgeCases.spec.ts

Copy file name to clipboard
+100-8Lines changed: 100 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,116 @@
1+
import { bundle, mockBundleAndRun, normalizeNewline } from './utils'
2+
3+
// @ts-ignore
4+
function assertComponent({
5+
instance,
6+
componentModule,
7+
window,
8+
expectedMsg = 'Hello from Component A!',
9+
}) {
10+
// <h2 class="red">{{msg}}</h2>
11+
expect(instance.$el.tagName).toBe('H2')
12+
expect(instance.$el.className).toBe('red')
13+
expect(instance.$el.textContent).toBe(expectedMsg)
14+
15+
// @ts-ignore
16+
expect(componentModule.data().msg).toContain(expectedMsg)
17+
18+
const style = normalizeNewline(
19+
window.document.querySelector('style')!.textContent!
20+
)
21+
expect(style).toContain('comp-a h2 {\n color: #f00;\n}')
22+
}
23+
124
// #1201
2-
test.todo('vue rule with include')
25+
test('vue rule with include', async () => {
26+
const result = await mockBundleAndRun({
27+
entry: 'basic.vue',
28+
modify: (config) => {
29+
config!.module!.rules[0] = {
30+
test: /\.vue$/,
31+
include: /fixtures/,
32+
loader: 'vue-loader',
33+
}
34+
},
35+
})
336

4-
test.todo('test-less oneOf rules')
37+
assertComponent(result)
38+
})
539

6-
// #1209
7-
test.todo('babel-loader inline options')
40+
test.todo('test-less oneOf rules')
841

942
// #1210
10-
test.todo('normalize multiple use + options')
43+
test('normalize multiple use + options', async () => {
44+
await bundle({
45+
entry: 'basic.vue',
46+
modify: (config) => {
47+
config!.module!.rules[0] = {
48+
test: /\.vue$/,
49+
use: [
50+
{
51+
loader: 'vue-loader',
52+
options: {},
53+
},
54+
],
55+
}
56+
},
57+
})
58+
})
1159

1260
test.todo('should not duplicate css modules value imports')
1361

1462
// #1213
1563
test.todo('html-webpack-plugin')
1664

1765
// #1239
18-
test.todo('usage with null-loader')
66+
test('usage with null-loader', async () => {
67+
await mockBundleAndRun({
68+
entry: 'basic.vue',
69+
modify: (config) => {
70+
config!.module!.rules[1] = {
71+
test: /\.css$/,
72+
use: ['null-loader'],
73+
}
74+
},
75+
})
76+
})
1977

2078
// #1278
21-
test.todo('proper dedupe on src-imports with options')
79+
test('proper dedupe on src-imports with options', async () => {
80+
const result = await mockBundleAndRun({
81+
entry: 'ts.vue',
82+
resolve: {
83+
extensions: ['.ts', '.js'],
84+
},
85+
module: {
86+
rules: [
87+
{
88+
test: /\.ts$/,
89+
loader: 'ts-loader',
90+
options: { appendTsSuffixTo: [/\.vue$/] },
91+
},
92+
],
93+
},
94+
})
95+
96+
assertComponent(result)
97+
})
2298

2399
// #1351
24-
test.todo('use with postLoader')
100+
test('use with postLoader', async () => {
101+
const result = await mockBundleAndRun({
102+
entry: 'basic.vue',
103+
module: {
104+
rules: [
105+
{
106+
test: /\.js$/,
107+
use: {
108+
loader: require.resolve('./mock-loaders/js'),
109+
},
110+
enforce: 'post',
111+
},
112+
],
113+
},
114+
})
115+
assertComponent(Object.assign({ expectedMsg: 'Changed!' }, result))
116+
})

‎test/fixtures/App.ts

Copy file name to clipboard
+14Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { defineComponent } from 'vue'
2+
3+
export default defineComponent({
4+
data() {
5+
return {
6+
msg: 'Hello from Component A!',
7+
}
8+
},
9+
methods: {
10+
someMethod(arg: string): string {
11+
return 'hello'
12+
},
13+
},
14+
})

‎test/fixtures/ts.vue

Copy file name to clipboard
+11Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<template>
2+
<h2 class="red">{{ msg }}</h2>
3+
</template>
4+
5+
<script src="./App.ts" lang="ts"></script>
6+
7+
<style>
8+
comp-a h2 {
9+
color: #f00;
10+
}
11+
</style>

‎test/mock-loaders/js.js

Copy file name to clipboard
+3Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = function (content) {
2+
return content.replace(/Hello from Component A!/, 'Changed!')
3+
}

‎test/mock-loaders/query.js

Copy file name to clipboard
+22Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
module.exports = function (content) {
2+
const query = this.resourceQuery.slice(1)
3+
4+
if (/change/.test(query)) {
5+
return `
6+
<template>
7+
<div>Changed!</div>
8+
</template>
9+
<script>
10+
export default {
11+
data () {
12+
return {
13+
msg: 'Changed!'
14+
}
15+
}
16+
}
17+
</script>
18+
`
19+
}
20+
21+
return content
22+
}

‎test/utils.ts

Copy file name to clipboardExpand all lines: test/utils.ts
+1-1Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ const baseConfig: webpack.Configuration = {
2626
rules: [
2727
{
2828
test: /\.vue$/,
29-
use: 'vue-loader',
29+
loader: 'vue-loader',
3030
},
3131
{
3232
test: /\.css$/,

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.