mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-12-24 20:24:05 -08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

fix(editor): Fix formatting on editors (no-changelog) (#6953)

Browse source 
Prettier 3 has a [new package
structure](https://prettier.io/blog/2023/07/05/3.0.0.html#npm-package-file-structures-changed-12740httpsgithubcomprettierprettierpull12740-by-fiskerhttpsgithubcomfisker-13530httpsgithubcomprettierprettierpull13530-by-fiskerhttpsgithubcomfisker-14570httpsgithubcomprettierprettierpull14570-by-fiskerhttpsgithubcomfisker),
made `format` async, and requires `estree` in specific cases.

e2e run: https://github.com/n8n-io/n8n/actions/runs/5889270624
This commit is contained in:
Iván Ovejero 2023-08-17 12:28:32 +02:00 committed by GitHub
parent 914dd1f046
commit 832d08776c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
packages/editor-ui/src/components/CodeNodeEditor/CodeNodeEditor.vue
View file

@ -42,8 +42,9 @@
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import jsParser from 'prettier/parser-babel';
import prettier from 'prettier/standalone';
import jsParser from 'prettier/plugins/babel';
import { format } from 'prettier';
import * as estree from 'prettier/plugins/estree';
import { mapStores } from 'pinia';
import type { LanguageSupport } from '@codemirror/language';
import type { Extension, Line } from '@codemirror/state';
@ -203,9 +204,9 @@ export default defineComponent({
return true;
},
async onReplaceCode(code: string) {
const formattedCode = prettier.format(code, {
const formattedCode = await format(code, {
parser: 'babel',
plugins: [jsParser],
plugins: [jsParser, estree],
});
this.editor?.dispatch({

25
packages/editor-ui/src/components/HtmlEditor/HtmlEditor.vue
View file

@ -4,10 +4,11 @@
<script lang="ts">
import { defineComponent } from 'vue';
import prettier from 'prettier/standalone';
import htmlParser from 'prettier/parser-html';
import cssParser from 'prettier/parser-postcss';
import jsParser from 'prettier/parser-babel';
import { format } from 'prettier';
import htmlParser from 'prettier/plugins/html';
import cssParser from 'prettier/plugins/postcss';
import jsParser from 'prettier/plugins/babel';
import * as estree from 'prettier/plugins/estree';
import { htmlLanguage, autoCloseTags, html } from 'codemirror-lang-html-n8n';
import { autocompletion } from '@codemirror/autocomplete';
import { indentWithTab, insertNewlineAndIndent, history, redo } from '@codemirror/commands';
@ -191,16 +192,16 @@ export default defineComponent({
);
},
format() {
async format() {
if (this.sections.length === 1 && this.isMissingHtmlTags()) {
const zerothSection = this.sections.at(0) as Section;
const formatted = prettier
.format(zerothSection.content, {
const formatted = (
await format(zerothSection.content, {
parser: 'html',
plugins: [htmlParser],
})
.trim();
).trim();
return this.editor.dispatch({
changes: { from: 0, to: this.doc.length, insert: formatted },
@ -211,7 +212,7 @@ export default defineComponent({
for (const { kind, content } of this.sections) {
if (kind === 'style') {
const formattedStyle = prettier.format(content, {
const formattedStyle = await format(content, {
parser: 'css',
plugins: [cssParser],
});
@ -220,9 +221,9 @@ export default defineComponent({
}
if (kind === 'script') {
const formattedScript = prettier.format(content, {
const formattedScript = await format(content, {
parser: 'babel',
plugins: [jsParser],
plugins: [jsParser, estree],
});
formatted.push(`<script>\n${formattedScript}<` + '/script>');
@ -238,7 +239,7 @@ export default defineComponent({
const { pre, rest } = match.groups;
const formattedRest = prettier.format(rest, {
const formattedRest = await format(rest, {
parser: 'html',
plugins: [htmlParser],
});