Skip to content

Proposal: Add --doctype-case option for customizable DOCTYPE casing #16588

Closed
#16765
Closed
Proposal: Add --doctype-case option for customizable DOCTYPE casing#16588
#16765
Labels
locked-due-to-inactivityPlease open a new issue and fill out the template instead of commenting.status:needs discussionIssues needing discussion and a decision to be made before action can be taken
@ptu14

Description

@ptu14
ptu14
opened on Aug 19, 2024

Prettier 3.3.3

Input:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

Output:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>
  <body></body>
</html>

Expected output:

Depends on the --doctype-case option setting:

For --doctype-case lowercase (can be default):

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>

For --doctype-case uppercase:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>

For --doctype-case preserve:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
</html>

Why?

Proposal to add a new configuration option --doctype-case to allow users to choose their preferred DOCTYPE casing style.

  • Specification compliance: The HTML5 specification allows for DOCTYPE to be written in both lowercase and uppercase (case-insensitive). However, the HTML specification explicitly states: "In other words, <!DOCTYPE html>, case-insensitively." This suggests that uppercase is the canonical form, which some developers prefer to follow strictly. https://html.spec.whatwg.org/multipage/syntax.html#the-doctype
  • Special nature of DOCTYPE: It's important to note that the DOCTYPE is not an HTML tag, but rather a required preamble. Its unique status as a declaration rather than a tag makes it a special case in HTML documents, which some argue warrants special consideration in formatting.
  • Flexibility: Different developers and teams have different preferences regarding code style. Adding this option will allow for customization of formatting to individual or team coding standards.
  • Backward compatibility: The preserve option will allow maintaining existing style in projects that don't want to introduce changes in DOCTYPE casing.
  • Resolving controversy: There are differing opinions in the community about the preferred DOCTYPE casing. Adding this option will allow reconciling different preferences without imposing a single style on all users.
  • Consistency with other tools: Some tools or environments may prefer a specific DOCTYPE casing style. This option will facilitate Prettier's integration with such tools. e.g. the Angular team is facing problems because of this change refactor: standardize doctype declaration to <!DOCTYPE html> angular/angular#51052 (comment)

The proposed implementation does not violate Prettier's opinionated principle as it concerns a purely stylistic aspect that does not affect the functionality or semantics of HTML code.

Metadata

Metadata

Assignees

No one assigned

    Labels

    locked-due-to-inactivityPlease open a new issue and fill out the template instead of commenting.status:needs discussionIssues needing discussion and a decision to be made before action can be taken

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions