Summary

The front-matter linter and Prettier are correcting each other and are causing some friction.

Problem

Formatters available in YAML space output exactly what is told, so the output remains same no matter the input. But Prettier is an intelligent formatter: it's output changes based on certain conditions.

In following examples YAML parser and Prettier have been told to prefer double quotes to enclose values.

# example 1
title: "TypeError: can't assign to property 'x' on 'y': not an object"

# in this case, both agree on the same thing
title: "TypeError: can't assign to property 'x' on 'y': not an object"

# example 2
title: "TypeError: can't assign to property \"x\" on \"y\": not an object"

# YAML parser yields the same string as output
title: "TypeError: can't assign to property \"x\" on \"y\": not an object"

# Prettier encloses string with double quoted words in single quotes
title: 'TypeError: can''t assign to property "x" on "y": not an object'

Solution

It's easy to simply run YAML formatter's output through Prettier before writing to file, than making the YAML formatter behave like Prettier:

let yml = YAML.dump(fmObject);
yml = await prettier.format(yml, { parser: "yaml" });
// write `yml` to file

Note: apart from above change following changes have been made:

• updated and added unit tests yarn test:front-matter-linter

• ran fix:js on all the .js files in the repo to confrom to the new Prettier v3.0.0

• The *.md files need to be committed before this PR are in Prettier style front-matter #27830

Testing

• Committed above code changes
• Commented /files/en-us/web/javascript/**/*.md line in .prettierignore file
• Ran fix:fm then committed the changes
• Ran 'fix:md' saw the diff
  Prettier didn't contradict front-matter linter.