Bug: Indent with inline css styles

[what1s1ove]

Info

Tool	Version
Plugin	v1.16.1
Prettier	v2.3.1
Framework	none
Node	v14.17.3
OS	mac

Prettier config

tabWidth: 4
bracketSpacing: true
printWidth: 120
singleQuote: true
trailingComma: none
useTabs: true
semi: true
arrowParens: avoid
endOfLine: auto
overrides:
  - files: '*.pug'
    options:
      pugTabWidth: 4
      pugUseTabs: 'true'
      pugSingleQuote: 'true'
      pugAttributeSeparator: always
      pugClosingBracketPosition: new-line
      pugWrapAttributesThreshold: 1
      pugExplicitDiv: false
      pugClassNotation: literal
      pugEmptyAttributes: none
      pugSortAttributes: asc
      pugSortAttributesBeginning:
        - id
        - class
        - src
        - href
        - type
        - width
        - height
        - alt
        - aria-
        - data-

Input

html
	head
		style(type='text/css').
			.container {
			  background-color: #e8eff3;
			  padding: 40px;
			  font-size: 1.1rem;
			}

Expected Output

html
	head
		style(type='text/css').
			.container {
				background-color: #e8eff3;
				padding: 40px;
				font-size: 1.1rem;
			}

Additional Context

Hi there!

after prettify

but should be like

Also, I use editorconfig-checker so I can't do anything at all 😥

Can you please tell me what is better for me to do? 🙏

[Shinigami92]

Could you try style. instead of style(type='text/css'). for a moment?
Also please report me if anything within the CSS gets formatted or not.

I assume it has something to do with code around here:

plugin-pug/src/printer.ts

Lines 1310 to 1323 in 3a1cbf2

	if (this.previousToken?.type === 'dot') {
	const lastTagToken: TagToken | undefined = previousTagToken(this.tokens, this.currentIndex);
	let parser: BuiltInParserName | undefined;
	switch (lastTagToken?.val) {
	case 'script':
	parser = getScriptParserName(previousTypeAttributeToken(this.tokens, this.currentIndex));
	break;
	case 'style':
	parser = 'css';
	break;
	default:
	break;
	}

If you like, please create a test and open a PR.
Otherwise I will add this to the list and try to tackle it upcoming weekend. 🙂

Have a nice day ☀️

[what1s1ove]

Hey @Shinigami92, thanks for the quick answer 🙏

Unfortunately it didn't help ☹️

I have this command on pre-commit. But not sure if it affects anything. Before I added pug to prettier I had a normal indentation and everything worked fine

'*.{ts,tsx,scss,json,md,pug}': prettier --write

[what1s1ove]

Hey @Shinigami92, thanks for fixing it 🙏

But now there is another problem 🥲

Now after the pretiffy, additional indents appear at the end of the styles...

But, strangely, this does not always happen. For example, everything is fine here:

[Shinigami92]

You can help me with creating a new bug issue, cause I reference these in my unit test suite (https://github.com/prettier/plugin-pug/tree/main/tests/issues)
And please don't use screenshots but raw markdown embedded examples, so I can then copy&paste them