images/babel-plugin-jsx
2
0
Fork 0
mirror of https://github.com/vuejs/babel-plugin-jsx.git synced 2024-09-20 04:44:44 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore(deps): update all non-major dependencies (#611)

Browse Source 
* chore(deps): update all non-major dependencies

* chore: remove the lockfile and reinstall to update trnasitive deps

The outdated `@types/babel__traverse` package is causing type errors

* fix: fix htmlTags type error

* fix: pin @types/node to 18.8.0 to work around https://github.com/johnsoncodehk/volar/issues/1985

* fix: pin @vue/test-utils temporarily to avoid snapshot differences

* test: update snapshot

As far as I see, all the snapshot differences are merely the newlines
after `import` statements

* test: add `attachTo: document.body` to make click event take effect

See https://github.com/vuejs/test-utils/issues/1470#issuecomment-1114752388

* fix: fix mjs processing for webpack 4

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Haoqun Jiang <haoqunjiang@gmail.com>
This commit is contained in:
renovate[bot] 2022-10-15 10:33:17 +08:00 committed by GitHub
parent e83be04abe
commit 367d21d7af
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 2616 additions and 2498 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.github/workflows/issue-reply.yml vendored
View File

@ -10,7 +10,7 @@ jobs:
steps:
- name: help wanted
if: github.event.label.name == 'help wanted'
uses: actions-cool/issues-helper@v2.1.1
uses: actions-cool/issues-helper@v2.5.0
with:
actions: 'create-comment'
issue-number: ${{ github.event.issue.number }}
@ -19,7 +19,7 @@ jobs:
- name: need reproduction
if: github.event.label.name == 'need reproduction'
uses: actions-cool/issues-helper@v2.1.1
uses: actions-cool/issues-helper@v2.5.0
with:
actions: 'create-comment'
issue-number: ${{ github.event.issue.number }}

9
package.json
View File

@ -16,10 +16,13 @@
"jsx"
],
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^4.30.0",
"@typescript-eslint/eslint-plugin": "^4.33.0",
"eslint": "^7.32.0",
"eslint-config-airbnb-typescript": "^12.3.1",
"eslint-plugin-import": "^2.24.2",
"lerna": "^3.19.0"
"eslint-plugin-import": "^2.26.0",
"lerna": "^3.22.1"
},
"resolutions": {
"@types/node": "18.8.0"
}
}

34
packages/babel-plugin-jsx/package.json
View File

@ -24,29 +24,29 @@
"dist"
],
"dependencies": {
"@babel/helper-module-imports": "^7.0.0",
"@babel/plugin-syntax-jsx": "^7.0.0",
"@babel/template": "^7.0.0",
"@babel/traverse": "^7.0.0",
"@babel/types": "^7.0.0",
"@babel/helper-module-imports": "^7.18.6",
"@babel/plugin-syntax-jsx": "^7.18.6",
"@babel/template": "^7.18.10",
"@babel/traverse": "^7.19.4",
"@babel/types": "^7.19.4",
"@vue/babel-helper-vue-transform-on": "^1.0.2",
"camelcase": "^6.0.0",
"html-tags": "^3.1.0",
"camelcase": "^6.3.0",
"html-tags": "^3.2.0",
"svg-tags": "^1.0.0"
},
"devDependencies": {
"@babel/core": "^7.15.5",
"@babel/preset-env": "^7.15.4",
"@babel/core": "^7.19.3",
"@babel/preset-env": "^7.19.4",
"@types/jest": "^26.0.24",
"@types/svg-tags": "^1.0.0",
"@typescript-eslint/eslint-plugin": "^4.30.0",
"@typescript-eslint/parser": "^4.30.0",
"@vue/compiler-dom": "3.2.8",
"@typescript-eslint/eslint-plugin": "^4.33.0",
"@typescript-eslint/parser": "^4.33.0",
"@vue/compiler-dom": "3.2.41",
"@vue/test-utils": "2.0.0-beta.2",
"jest": "^26.0.1",
"regenerator-runtime": "^0.13.9",
"ts-jest": "^26.1.3",
"typescript": "^4.4.2",
"vue": "3.2.26"
"jest": "^26.6.3",
"regenerator-runtime": "^0.13.10",
"ts-jest": "^26.5.6",
"typescript": "^4.8.4",
"vue": "3.2.41"
}
}

4
packages/babel-plugin-jsx/src/utils.ts
View File

@ -51,7 +51,7 @@ export const checkIsComponent = (path: NodePath<t.JSXOpeningElement>, state: Sta
const tag = (namePath as NodePath<t.JSXIdentifier>).node.name;
return !state.opts.isCustomElement?.(tag) && shouldTransformedToSlots(tag) && !htmlTags.includes(tag) && !svgTags.includes(tag);
return !state.opts.isCustomElement?.(tag) && shouldTransformedToSlots(tag) && !htmlTags.includes(tag as htmlTags.htmlTags) && !svgTags.includes(tag);
};
/**
@ -86,7 +86,7 @@ export const getTag = (
const namePath = path.get('openingElement').get('name');
if (namePath.isJSXIdentifier()) {
const { name } = namePath.node;
if (!htmlTags.includes(name) && !svgTags.includes(name)) {
if (!htmlTags.includes(name as htmlTags.htmlTags) && !svgTags.includes(name)) {
return (name === FRAGMENT
? createIdentifier(state, FRAGMENT)
: path.scope.hasBinding(name)

44
packages/babel-plugin-jsx/test/__snapshots__/snapshot.test.ts.snap
View File

@ -3,15 +3,12 @@
exports[`_Fragment already imported: _Fragment already imported 1`] = `
"import { createVNode as _createVNode, createTextVNode as _createTextVNode, Fragment as _Fragment2 } from \\"vue\\";
import { Fragment as _Fragment } from 'vue';
const Root1 = () => _createVNode(_Fragment2, null, [_createTextVNode(\\"root1\\")]);
const Root2 = () => _createVNode(_Fragment, null, [_createTextVNode(\\"root2\\")]);"
`;
exports[`MereProps Order: MereProps Order 1`] = `
"import { createVNode as _createVNode, mergeProps as _mergeProps, createTextVNode as _createTextVNode } from \\"vue\\";
_createVNode(\\"button\\", _mergeProps({
\\"loading\\": true
}, x, {
@ -21,7 +18,6 @@ _createVNode(\\"button\\", _mergeProps({
exports[`Merge class/ style attributes into array: Merge class/ style attributes into array 1`] = `
"import { createVNode as _createVNode } from \\"vue\\";
_createVNode(\\"div\\", {
\\"class\\": [\\"a\\", b],
\\"style\\": [\\"color: red\\", s]
@ -35,19 +31,16 @@ createVNode('div', null, ['Without JSX should work']);"
exports[`Without props: Without props 1`] = `
"import { createVNode as _createVNode, createTextVNode as _createTextVNode } from \\"vue\\";
_createVNode(\\"a\\", null, [_createTextVNode(\\"a\\")]);"
`;
exports[`custom directive: custom directive 1`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, resolveDirective as _resolveDirective, resolveComponent as _resolveComponent } from \\"vue\\";
_withDirectives(_createVNode(_resolveComponent(\\"A\\"), null, null, 512), [[_resolveDirective(\\"cus\\"), x]]);"
`;
exports[`custom directive: custom directive 2`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, resolveDirective as _resolveDirective, resolveComponent as _resolveComponent, Fragment as _Fragment } from \\"vue\\";
_createVNode(_Fragment, null, [_withDirectives(_createVNode(_resolveComponent(\\"A\\"), null, null, 512), [[_resolveDirective(\\"xxx\\"), x]]), _withDirectives(_createVNode(_resolveComponent(\\"A\\"), null, null, 512), [[_resolveDirective(\\"xxx\\"), x]]), _withDirectives(_createVNode(_resolveComponent(\\"A\\"), null, null, 512), [[_resolveDirective(\\"xxx\\"), x, 'y']]), _withDirectives(_createVNode(_resolveComponent(\\"A\\"), null, null, 512), [[_resolveDirective(\\"xxx\\"), x, 'y', {
a: true,
b: true
@ -65,7 +58,6 @@ _createVNode(_Fragment, null, [_withDirectives(_createVNode(_resolveComponent(\\
exports[`disable object slot syntax with defaultSlot: defaultSlot 1`] = `
"import { createVNode as _createVNode, resolveComponent as _resolveComponent } from \\"vue\\";
_createVNode(_resolveComponent(\\"Badge\\"), null, {
default: () => [slots.default()],
_: 1
@ -74,7 +66,6 @@ _createVNode(_resolveComponent(\\"Badge\\"), null, {
exports[`dynamic type in input: dynamic type in input 1`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, vModelDynamic as _vModelDynamic } from \\"vue\\";
_withDirectives(_createVNode(\\"input\\", {
\\"type\\": type,
\\"onUpdate:modelValue\\": $event => test = $event
@ -83,7 +74,6 @@ _withDirectives(_createVNode(\\"input\\", {
exports[`input[type="checkbox"]: input[type="checkbox"] 1`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, vModelCheckbox as _vModelCheckbox } from \\"vue\\";
_withDirectives(_createVNode(\\"input\\", {
\\"type\\": \\"checkbox\\",
\\"onUpdate:modelValue\\": $event => test = $event
@ -92,7 +82,6 @@ _withDirectives(_createVNode(\\"input\\", {
exports[`input[type="radio"]: input[type="radio"] 1`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, vModelRadio as _vModelRadio, Fragment as _Fragment } from \\"vue\\";
_createVNode(_Fragment, null, [_withDirectives(_createVNode(\\"input\\", {
\\"type\\": \\"radio\\",
\\"value\\": \\"1\\",
@ -108,7 +97,6 @@ _createVNode(_Fragment, null, [_withDirectives(_createVNode(\\"input\\", {
exports[`input[type="text"] .lazy modifier: input[type="text"] .lazy modifier 1`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, vModelText as _vModelText } from \\"vue\\";
_withDirectives(_createVNode(\\"input\\", {
\\"onUpdate:modelValue\\": $event => test = $event
}, null, 8, [\\"onUpdate:modelValue\\"]), [[_vModelText, test, void 0, {
@ -118,7 +106,6 @@ _withDirectives(_createVNode(\\"input\\", {
exports[`input[type="text"]: input[type="text"] 1`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, vModelText as _vModelText } from \\"vue\\";
_withDirectives(_createVNode(\\"input\\", {
\\"onUpdate:modelValue\\": $event => test = $event
}, null, 8, [\\"onUpdate:modelValue\\"]), [[_vModelText, test]]);"
@ -126,27 +113,23 @@ _withDirectives(_createVNode(\\"input\\", {
exports[`isCustomElement: isCustomElement 1`] = `
"import { createVNode as _createVNode, createTextVNode as _createTextVNode } from \\"vue\\";
_createVNode(\\"foo\\", null, [_createVNode(\\"span\\", null, [_createTextVNode(\\"foo\\")])]);"
`;
exports[`named import specifier \`Keep Alive\`: named import specifier \`Keep Alive\` 1`] = `
"import { createVNode as _createVNode, createTextVNode as _createTextVNode } from \\"vue\\";
import { KeepAlive } from 'vue';
_createVNode(KeepAlive, null, [_createTextVNode(\\"123\\")]);"
`;
exports[`namespace specifier \`Keep Alive\`: namespace specifier \`Keep Alive\` 1`] = `
"import { createVNode as _createVNode, createTextVNode as _createTextVNode } from \\"vue\\";
import * as Vue from 'vue';
_createVNode(Vue.KeepAlive, null, [_createTextVNode(\\"123\\")]);"
`;
exports[`override props multiple: multiple 1`] = `
"import { createVNode as _createVNode, resolveComponent as _resolveComponent } from \\"vue\\";
_createVNode(_resolveComponent(\\"A\\"), {
\\"loading\\": true,
...a,
@ -161,13 +144,11 @@ _createVNode(_resolveComponent(\\"A\\"), {
exports[`override props single: single 1`] = `
"import { createVNode as _createVNode } from \\"vue\\";
_createVNode(\\"div\\", a, null);"
`;
exports[`passing object slots via JSX children multiple expressions: multiple expressions 1`] = `
"import { createVNode as _createVNode, resolveComponent as _resolveComponent } from \\"vue\\";
_createVNode(_resolveComponent(\\"A\\"), null, {
default: () => [foo, bar],
_: 1
@ -176,7 +157,6 @@ _createVNode(_resolveComponent(\\"A\\"), null, {
exports[`passing object slots via JSX children single expression, function expression: single expression, function expression 1`] = `
"import { createVNode as _createVNode, resolveComponent as _resolveComponent } from \\"vue\\";
_createVNode(_resolveComponent(\\"A\\"), null, {
default: () => \\"foo\\"
});"
@ -184,15 +164,11 @@ _createVNode(_resolveComponent(\\"A\\"), null, {
exports[`passing object slots via JSX children single expression, non-literal value: runtime check: single expression, non-literal value: runtime check 1`] = `
"let _slot;
import { createVNode as _createVNode, isVNode as _isVNode, resolveComponent as _resolveComponent } from \\"vue\\";
function _isSlot(s) {
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !_isVNode(s);
}
const foo = () => 1;
_createVNode(_resolveComponent(\\"A\\"), null, _isSlot(_slot = foo()) ? _slot : {
default: () => [_slot],
_: 1
@ -202,11 +178,9 @@ _createVNode(_resolveComponent(\\"A\\"), null, _isSlot(_slot = foo()) ? _slot :
exports[`reassign variable as component: reassign variable as component 1`] = `
"import { isVNode as _isVNode, createVNode as _createVNode } from \\"vue\\";
import { defineComponent } from 'vue';
function _isSlot(s) {
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !_isVNode(s);
}
let a = 1;
const A = defineComponent({
setup(_, {
@ -214,15 +188,12 @@ const A = defineComponent({
}) {
return () => _createVNode(\\"span\\", null, [slots.default()]);
}
});
const _a2 = 2;
a = _a2;
const _a = function () {
return a;
}();
a = _createVNode(A, null, _isSlot(a) ? a : {
default: () => [_a],
_: 2
@ -231,7 +202,6 @@ a = _createVNode(A, null, _isSlot(a) ? a : {
exports[`select: select 1`] = `
"import { withDirectives as _withDirectives, vModelSelect as _vModelSelect, createVNode as _createVNode, createTextVNode as _createTextVNode } from \\"vue\\";
_withDirectives(_createVNode(\\"select\\", {
\\"onUpdate:modelValue\\": $event => test = $event
}, [_createVNode(\\"option\\", {
@ -251,13 +221,11 @@ custom(\\"div\\", null, [_createTextVNode(\\"pragma\\")]);"
exports[`should keep \`import * as Vue from "vue"\`: should keep \`import * as Vue from "vue"\` 1`] = `
"import { createVNode as _createVNode, createTextVNode as _createTextVNode } from \\"vue\\";
import * as Vue from 'vue';
_createVNode(\\"div\\", null, [_createTextVNode(\\"Vue\\")]);"
`;
exports[`single no need for a mergeProps call: single no need for a mergeProps call 1`] = `
"import { createVNode as _createVNode, createTextVNode as _createTextVNode } from \\"vue\\";
_createVNode(\\"div\\", x, [_createTextVNode(\\"single\\")], 16);"
`;
@ -265,13 +233,11 @@ exports[`specifiers should be merged into a single importDeclaration: specifiers
"import { createVNode as _createVNode } from \\"vue\\";
import { createVNode, Fragment as _Fragment } from 'vue';
import { vShow } from 'vue';
_createVNode(_Fragment, null, null);"
`;
exports[`textarea: textarea 1`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, vModelText as _vModelText } from \\"vue\\";
_withDirectives(_createVNode(\\"textarea\\", {
\\"onUpdate:modelValue\\": $event => test = $event
}, null, 8, [\\"onUpdate:modelValue\\"]), [[_vModelText, test]]);"
@ -279,7 +245,6 @@ _withDirectives(_createVNode(\\"textarea\\", {
exports[`use "@jsx" comment specify pragma: use "@jsx" comment specify pragma 1`] = `
"import { createTextVNode as _createTextVNode } from \\"vue\\";
/* @jsx custom */
custom(\\"div\\", {
\\"id\\": \\"custom\\"
@ -288,7 +253,6 @@ custom(\\"div\\", {
exports[`use "model" as the prop name: use "model" as the prop name 1`] = `
"import { createVNode as _createVNode, resolveComponent as _resolveComponent } from \\"vue\\";
_createVNode(_resolveComponent(\\"C\\"), {
\\"model\\": foo,
\\"onUpdate:model\\": $event => foo = $event
@ -297,20 +261,16 @@ _createVNode(_resolveComponent(\\"C\\"), {
exports[`using v-slots without children should not be spread: using v-slots without children should not be spread 1`] = `
"import { createVNode as _createVNode, resolveDirective as _resolveDirective, resolveComponent as _resolveComponent } from \\"vue\\";
_createVNode(_resolveComponent(\\"A\\"), null, slots);"
`;
exports[`v-model target value support variable: v-model target value support variable 1`] = `
"import { createVNode as _createVNode, resolveComponent as _resolveComponent, Fragment as _Fragment } from \\"vue\\";
const foo = 'foo';
const a = () => 'a';
const b = {
c: 'c'
};
_createVNode(_Fragment, null, [_createVNode(_resolveComponent(\\"A\\"), {
[foo]: xx,
[\\"onUpdate\\" + foo]: $event => xx = $event
@ -349,13 +309,11 @@ _createVNode(_Fragment, null, [_createVNode(_resolveComponent(\\"A\\"), {
exports[`v-show: v-show 1`] = `
"import { withDirectives as _withDirectives, createVNode as _createVNode, vShow as _vShow, createTextVNode as _createTextVNode } from \\"vue\\";
_withDirectives(_createVNode(\\"div\\", null, [_createTextVNode(\\"vShow\\")], 512), [[_vShow, x]]);"
`;
exports[`vHtml: vHtml 1`] = `
"import { createVNode as _createVNode } from \\"vue\\";
_createVNode(\\"h1\\", {
\\"innerHTML\\": \\"<div>foo</div>\\"
}, null, 8, [\\"innerHTML\\"]);"
@ -363,7 +321,6 @@ _createVNode(\\"h1\\", {
exports[`vModels: vModels 1`] = `
"import { createVNode as _createVNode, resolveComponent as _resolveComponent } from \\"vue\\";
_createVNode(_resolveComponent(\\"C\\"), {
\\"modelValue\\": foo,
\\"modelModifiers\\": {
@ -381,7 +338,6 @@ _createVNode(_resolveComponent(\\"C\\"), {
exports[`vText: vText 1`] = `
"import { createVNode as _createVNode } from \\"vue\\";
_createVNode(\\"div\\", {
\\"textContent\\": text
}, null, 8, [\\"textContent\\"]);"

6
packages/babel-plugin-jsx/test/v-model.test.tsx
View File

@ -10,8 +10,8 @@ test('input[type="checkbox"] should work', async () => {
},
render() {
return <input type="checkbox" v-model={this.test} />;
},
});
}
}, { attachTo: document.body });
expect(wrapper.vm.$el.checked).toBe(true);
wrapper.vm.test = false;
@ -36,7 +36,7 @@ test('input[type="radio"] should work', async () => {
</>
);
},
});
}, { attachTo: document.body });
const [a, b] = wrapper.vm.$.subTree.children as VNode[];

16
packages/jsx-explorer/package.json
View File

@ -3,17 +3,17 @@
"version": "1.1.0",
"private": true,
"dependencies": {
"monaco-editor": "^0.27.0"
"monaco-editor": "^0.34.0"
},
"devDependencies": {
"@babel/core": "^7.15.5",
"css-loader": "^3.5.3",
"@babel/core": "^7.19.3",
"css-loader": "^3.6.0",
"html-webpack-plugin": "^4.5.2",
"style-loader": "^1.2.1",
"ts-loader": "^8.3.0",
"typescript": "^4.4.2",
"vue": "3.2.26",
"style-loader": "^1.3.0",
"ts-loader": "^8.4.0",
"typescript": "^4.8.4",
"vue": "3.2.41",
"webpack": "^4.46.0",
"webpack-dev-server": "^3.11.2"
"webpack-dev-server": "^3.11.3"
}
}

3
renovate.json
View File

@ -7,5 +7,6 @@
":semanticCommitTypeAll(chore)"
],
"rangeStrategy": "bump",
"labels": ["dependencies"]
"labels": ["dependencies"],
"ignoreDeps": ["@types/node", "@vue/test-utils"]
}

7
scripts/webpack.base.conf.js
View File

@ -26,6 +26,11 @@ module.exports = {
'style-loader', 'css-loader',
],
},
{
test: /\.mjs$/,
include: /node_modules/,
type: 'javascript/auto'
}
],
},
plugins: [
@ -35,7 +40,7 @@ module.exports = {
}),
],
resolve: {
extensions: ['.ts', '.js'],
extensions: ['.ts', '.js', '.mjs'],
},
node: {
fs: 'empty',

4987
yarn.lock
View File

File diff suppressed because it is too large Load Diff