diff --git a/src/printer.ts b/src/printer.ts index 3833f42a..5f50700f 100644 --- a/src/printer.ts +++ b/src/printer.ts @@ -573,13 +573,16 @@ export class PugPrinter { { trimTrailingSemicolon = false }: FormatDelegatePrettierOptions = {} ): string { val = val.trim(); - val = val.slice(1, -1); // Remove quotes + const wasQuoted: boolean = isQuoted(val); + if (wasQuoted) { + val = val.slice(1, -1); // Remove quotes + } val = format(val, { parser, ...this.codeInterpolationOptions }); val = unwrapLineFeeds(val); if (trimTrailingSemicolon && val[val.length - 1] === ';') { val = val.slice(0, -1); } - return this.quoteString(val); + return wasQuoted ? this.quoteString(val) : val; } private formatStyleAttribute(val: string): string { diff --git a/src/utils/common.ts b/src/utils/common.ts index f65a9596..3c3d16b5 100644 --- a/src/utils/common.ts +++ b/src/utils/common.ts @@ -165,7 +165,7 @@ export function isWrappedWith(val: string, start: string, end: string, offset: n * @returns Whether the value is quoted or not. */ export function isQuoted(val: string): boolean { - if (/^(["'])(.*)\1$/.test(val)) { + if (/^(["'`])(.*)\1$/.test(val)) { // Regex for checking if there are any unescaped quotations. const regex: RegExp = new RegExp(`${val[0]}(? { + test('should not quote pug variables assigned to Vue props', () => { + const expected: string = readFileSync(resolve(__dirname, 'formatted.pug'), 'utf8'); + const code: string = readFileSync(resolve(__dirname, 'unformatted.pug'), 'utf8'); + const actual: string = format(code, { parser: 'pug', plugins: [plugin] }); + + expect(actual).toBe(expected); + }); +}); diff --git a/tests/issues/issue-250/unformatted.pug b/tests/issues/issue-250/unformatted.pug new file mode 100644 index 00000000..76d3e2cc --- /dev/null +++ b/tests/issues/issue-250/unformatted.pug @@ -0,0 +1,9 @@ +- const circleSize = 72; +- const circleWidth = 7; +div + v-progress-circular( + :color="getProgressColor(currentCapacity)", + :size=circleSize, + :value='capacityPercentage', + :width=circleWidth, + ) {{ currentCapacity }}/{{ maxCapacity }} diff --git a/tests/issues/issue-61/formatted.pug b/tests/issues/issue-61/formatted.pug index 1573514d..1ff20f90 100644 --- a/tests/issues/issue-61/formatted.pug +++ b/tests/issues/issue-61/formatted.pug @@ -11,3 +11,8 @@ div a( [href]='Nav.currentProject().repo(getRepository(pipeline).slug).buildNoContext()' ) + - const interpolation = "code" + //- Vue + a(:href=`interpolated-${interpolation}`) + //- Angular + a([href]=`interpolated-${interpolation}`) diff --git a/tests/issues/issue-61/unformatted.pug b/tests/issues/issue-61/unformatted.pug index 0252065d..acbc8336 100644 --- a/tests/issues/issue-61/unformatted.pug +++ b/tests/issues/issue-61/unformatted.pug @@ -7,3 +7,8 @@ div a(:href=`Nav.currentProject().repo(getRepository(pipeline).slug).buildNoContext()`) //- Angular a([href]=`Nav.currentProject().repo(getRepository(pipeline).slug).buildNoContext()`) + - const interpolation = 'code' + //- Vue + a(:href=`interpolated-${interpolation}`) + //- Angular + a([href]=`interpolated-${interpolation}`) diff --git a/tests/issues/issue-80/formatted.pug b/tests/issues/issue-80/formatted.pug index 263ffc61..94b965ae 100644 --- a/tests/issues/issue-80/formatted.pug +++ b/tests/issues/issue-80/formatted.pug @@ -17,3 +17,8 @@ div span.aui-lozenge( :class='[isActive ? "some-class-name" : "some-other-class-name"]' ) + + - const interpolation = "some-class-name" + span.aui-lozenge( + :class=`[ isActive ? ${interpolation} : "some-other-class-name" ]` + ) diff --git a/tests/issues/issue-80/unformatted.pug b/tests/issues/issue-80/unformatted.pug index 645dec71..e711d0a3 100644 --- a/tests/issues/issue-80/unformatted.pug +++ b/tests/issues/issue-80/unformatted.pug @@ -17,3 +17,8 @@ div span.aui-lozenge( :class='[ isActive ? "some-class-name" : "some-other-class-name" ]' ) + + - const interpolation = "some-class-name" + span.aui-lozenge( + :class=`[ isActive ? ${interpolation} : "some-other-class-name" ]` + )