Skip to content

Commit 4f4ce0c

Browse files
committedDec 31, 2020
feat: implement Vue.delete transformation
1 parent d6d8b10 commit 4f4ce0c

File tree

2 files changed

+118
-17
lines changed

2 files changed

+118
-17
lines changed
 

‎transformations/__tests__/remove-vue-set-and-delete.spec.ts

+82
Original file line numberDiff line numberDiff line change
@@ -83,4 +83,86 @@ defineInlineTest(
8383
`don't remove random .$set functions`
8484
)
8585

86+
defineInlineTest(
87+
transform,
88+
{},
89+
`Vue.delete(vm.someObject, 'b');`,
90+
`delete vm.someObject['b'];`,
91+
'Remove Vue.delete'
92+
)
93+
94+
defineInlineTest(
95+
transform,
96+
{},
97+
`export default {
98+
methods: {
99+
modify() {
100+
this.$delete(this.someObject, 'b');
101+
}
102+
}
103+
};`,
104+
`export default {
105+
methods: {
106+
modify() {
107+
delete this.someObject['b'];
108+
}
109+
}
110+
};`,
111+
'Remove this.$delete'
112+
)
113+
114+
defineInlineTest(
115+
transform,
116+
{},
117+
`export default {
118+
created () {
119+
const vm = this;
120+
this.$on('some-event', function () {
121+
vm.$delete(vm.someObject, 'b');
122+
})
123+
}
124+
};`,
125+
`export default {
126+
created () {
127+
const vm = this;
128+
this.$on('some-event', function () {
129+
delete vm.someObject['b'];
130+
})
131+
}
132+
};`,
133+
'Remove vm.$delete when vm is an alias to this'
134+
)
135+
136+
defineInlineTest(
137+
transform,
138+
{},
139+
`export default {
140+
created () {
141+
var vm = this;
142+
vm = { $delete: () => {} }
143+
this.$on('some-event', function () {
144+
vm.$delete(vm.someObject, 'b');
145+
})
146+
}
147+
};`,
148+
`export default {
149+
created () {
150+
var vm = this;
151+
vm = { $delete: () => {} }
152+
this.$on('some-event', function () {
153+
vm.$delete(vm.someObject, 'b');
154+
})
155+
}
156+
};`,
157+
`Don't remove vm.$delete when we are not sure if vm is an alias to this`
158+
)
159+
160+
defineInlineTest(
161+
transform,
162+
{},
163+
`value.$delete('a', 1)`,
164+
`value.$delete('a', 1)`,
165+
`don't remove random .$delete functions`
166+
)
167+
86168
// TODO: delete

‎transformations/remove-vue-set-and-delete.ts

+36-17
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export const transformAST: ASTTransformation = (context) => {
1414
return j.Identifier.check(node) && node.name === 'Vue'
1515
}
1616

17-
const setCalls = root
17+
const setOrDeleteCalls = root
1818
.find(j.CallExpression, (n: N.CallExpression) => {
1919
if (
2020
!j.MemberExpression.check(n.callee) ||
@@ -23,11 +23,16 @@ export const transformAST: ASTTransformation = (context) => {
2323
return false
2424
}
2525

26-
if (n.callee.property.name === 'set' && isVue(n.callee.object)) {
26+
const propName = n.callee.property.name
27+
28+
if (
29+
(propName === 'set' || propName === 'delete') &&
30+
isVue(n.callee.object)
31+
) {
2732
return true
2833
}
2934

30-
if (n.callee.property.name === '$set') {
35+
if (propName === '$set' || propName === '$delete') {
3136
// we need the path & scope to check if the object is `this`
3237
// so leave it to the filter function
3338
return true
@@ -36,8 +41,11 @@ export const transformAST: ASTTransformation = (context) => {
3641
return false
3742
})
3843
.filter((path) => {
39-
// @ts-ignore
40-
if (path.node.callee.property.name !== '$set') {
44+
const prop = (path.node.callee as N.MemberExpression)
45+
.property as N.Identifier
46+
47+
// only the object of `.$set` and `.$delete` is pending for check
48+
if (prop.name !== '$set' && prop.name !== '$delete') {
4149
return true
4250
}
4351

@@ -68,22 +76,33 @@ export const transformAST: ASTTransformation = (context) => {
6876
return false
6977
})
7078

71-
setCalls.replaceWith(({ node }) => {
72-
if (
73-
node.arguments.length !== 3 ||
74-
node.arguments.some((arg) => j.SpreadElement.check(arg))
75-
) {
79+
setOrDeleteCalls.replaceWith(({ node }) => {
80+
if (node.arguments.some((arg) => j.SpreadElement.check(arg))) {
7681
// TODO: add a comment to inform the user that this kind of usage can't be transformed
7782
return node
7883
}
7984

80-
return j.assignmentExpression(
81-
'=',
82-
// @ts-ignore
83-
j.memberExpression(node.arguments[0], node.arguments[1], true),
84-
// @ts-ignore
85-
node.arguments[2]
86-
)
85+
const prop = (node.callee as N.MemberExpression).property as N.Identifier
86+
if (prop.name === '$set' || prop.name === 'set') {
87+
return j.assignmentExpression(
88+
'=',
89+
// @ts-ignore
90+
j.memberExpression(node.arguments[0], node.arguments[1], true),
91+
// @ts-ignore
92+
node.arguments[2]
93+
)
94+
}
95+
96+
if (prop.name === '$delete' || prop.name === 'delete') {
97+
return j.unaryExpression(
98+
'delete',
99+
// @ts-ignore
100+
j.memberExpression(node.arguments[0], node.arguments[1], true)
101+
)
102+
}
103+
104+
// unreachable branch
105+
return node
87106
})
88107
}
89108

0 commit comments

Comments
 (0)