Fix TypeError for syntaxes that use Document in indentation

[43081j]

What steps are needed to reproduce the bug?

If you have a Root in a Document whose css begins on line 1, like so:

  .foo {
    color: hotpink;
  }

The indentation rule will throw, as it tries to access root.raws.beforeStart which doesn't exist.

What Stylelint configuration is needed to reproduce the bug?

{
  "rules": {
    "indentation": 2
  }
}

How did you run Stylelint?

CLI

Which version of Stylelint are you using?

14

What did you expect to happen?

Indentation rule would succeed.

What actually happened?

The rule throws:

TypeError: Cannot read properties of undefined (reading 'endsWith')

Does the bug relate to non-standard syntax?

No

Proposal to fix the bug

stylelint/lib/rules/indentation/index.js

Lines 94 to 98 in 0d2303e

	if (
	(lastIndexOfNewline !== -1 ||
	(isFirstChild && (!getDocument(parent) || parent.raws.beforeStart.endsWith('\n')))) &&
	before.slice(lastIndexOfNewline + 1) !== expectedOpeningBraceIndentation
	) {

Ultimately, we hit this condition. It is comprised of these:

Does node.raws.before contain a newline? - No, so we continue.

Is it the first child? - Yes.

Does it's parent have a document? - Yes.

This leads us to then attempting to execute parent.raws.beforeStart.endsWith('\n') which will fail if beforeStart doesn't exist.

We should null check parent.raws.beforeStart as it may never exist, or a plugin could have since removed it.

Btw I am aware of #5674 , so please let me know if you'll never fix this as I can fix it on my end instead (by populating beforeStart with an empty string at least).

[ybiquitous]

@43081j Thank you for creating this issue and using the template!

I cannot reproduce the error on this demo, so could you share more detailed reproduction, please?

---

We should null check parent.raws.beforeStart as it may never exist,

This seems needed to me.

[43081j]

this causes it:

import stylelint from 'stylelint';
import {stringify, Document, Input} from 'postcss';
import postcssParse from 'postcss/lib/parse';

const parse = (source, opts) => {
  const doc = new Document();
  const root = postcssParse(source, opts);
  root.parent = doc;
  root.document = doc;
  doc.nodes.push(root);
  doc.source = {
    input: new Input(source, opts),
    start: {line: 1, column: 1, offset: 0}
  };
  return doc;
};

(async () => {
  const code = `.foo {
    color: hotpink;
  }`;
  await stylelint.lint({
    customSyntax: {
      parse,
      stringify
    },
    code,
    codeFilename: 'foo.js',
    config: {
      rules: {
        indentation: 2
      }
    }
  });
})();

[ybiquitous]

@43081j Thank you for providing the reproduction! I understand the bug's behavior. 👍🏼

I think we should do the following:

• It's needed to replace beforeStart with codeBefore as Fix TypeError for baseIndentLevel: 1 option and vue file in indentation #5657 did.
  • the beforeStart property is outdated. And maybe, only postcss-html may set it.
  • See https://github.com/ota-meshi/postcss-html/blob/dc66e2af325181a483be5d1f7fbb18912cd89344/lib/html/parse-styles.js#L148-L161
• It's needed to check if parent.raws.codeBefore is empty.

I've labeled the issue as ready to implement. Please consider contributing if you have time.

There are steps on how to fix a bug in a rule in the Developer guide.