Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug: places closing paren in wrong location of v-for #251

Open
2 of 7 tasks
bitencode opened this issue Jul 5, 2021 · 1 comment
Open
2 of 7 tasks

Bug: places closing paren in wrong location of v-for #251

bitencode opened this issue Jul 5, 2021 · 1 comment
Labels
framework: Vue Related to the framework Vue type: bug Functionality that does not work as intended/expected

Comments

@bitencode
Copy link
Contributor

Plugin Version

v1.15.3 & 1.16.0-0

Prettier Version

v2.3.1

Which frameworks are affected?

  • none
  • vue
  • angular
  • svelte

Node Version

v12.19.1

Which operating systems have you used?

  • Linux
  • macOS
  • Windows

Prettier config

{
  arrowParens: 'always',
  bracketSpacing: true,
  jsxBracketSameLine: false,
  printWidth: 100,
  proseWrap: 'preserve',
  semi: true,
  singleQuote: true,
  tabWidth: 2,
  trailingComma: 'es5',
  useTabs: false,
  pugAttributeSeparator: 'none',
  pugClassNotation: 'literal',
  pugEmptyAttributes: 'none',
  pugExplicitDiv: true,
  pugFramework: 'vue',
  pugIdNotation: 'literal',
  pugSingleFileComponentIndentation: true,
  pugSingleQuote: false,
  pugSortAttributes: 'asc',
  pugSortAttributesBeginning: ['^:?is', '^v-for', '^v-', '^:?id$', '^:?key$', '^:?ref$'],
  pugSortAttributesEnd: ['^:', '^v-on$', '^@', '^v-html$', '^v-text$'],
  pugWrapAttributesThreshold: 1,
}

Input

div.px-6.mb-2(
  v-for="transferService, index in allTransferServices"
  :key="`${transferService.protocol}-${transferService.id}`"
)

Output or Error

.px-6.mb-2(
  v-for="(transferService, index in allTransferServices)"
  :key="`${transferService.protocol}-${transferService.id}`"
)

Expected Output

.px-6.mb-2(
  v-for="(transferService, index) in allTransferServices"
  :key="`${transferService.protocol}-${transferService.id}`"
)

Additional Context

While we should technically have the parentheses in the markup, I've found a few places where they were missed as in the example above. Vue does do the right thing with that v-for and knows the first value is the value and the second is the index even without the proper parentheses. The "fix" for this appears to put the ending parentheses in the wrong place. Example diff after running yarn prettier --write src/**/*.vue:
GitKraken
Identical results on version 1.15.3 and 1.16.0-0.

@bitencode
Copy link
Contributor Author

I was looking at this a bit this evening, and it may be an issue that plugin-pug can't do anything about. In formatDelegatePrettier(...) just before prettier format() is called the value for val is transferService, index in allTransferServices. The returned value of format(val, { parser, ...this.codeInterpolationOptions }); is (transferService, index in allTransferServices), so it looks to me like it might not be something to fix here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
framework: Vue Related to the framework Vue type: bug Functionality that does not work as intended/expected
Projects
None yet
Development

No branches or pull requests

2 participants