Merge branch 'main' into next

# Conflicts:
#	docs/browser.md
#	src/language-html/parser-html.js
#	src/language-js/print/jsx.js
#	src/language-js/print/typescript.js
#	website/yarn.lock
#	yarn.lock
This commit is contained in:
fisker Cheung committed 2023-01-16 15:53:36 +08:00
commit b332654039
18 files changed
+256 -58

No files matched your search

+2
View File
@@ -5,6 +5,8 @@
# See https://git-scm.com/docs/git-blame#Documentation/git-blame.txt---ignore-revs-fileltfilegt
# Prettier bump after release
# 2.8.3
9e9f8ec13f0420a4825fdba85d79ddeaaef1e00c
# 2.8.2
b9c3cd4c7016dfb1bb3539c5b3db15fdd54b9f6f
# 2.8.1
+1 -1
View File
@@ -26,7 +26,7 @@ Don't fill the form below manually! Let a program create a report for you:
-->
**Prettier 2.8.2**
**Prettier 2.8.3**
[Playground link](https://prettier.io/playground/#.....)
```sh
+1 -1
View File
@@ -20,7 +20,7 @@ BEFORE SUBMITTING AN ISSUE:
**Environments:**
- Prettier Version: 2.8.2
- Prettier Version: 2.8.3
- Running Prettier via: <!-- CLI, Node.js API, Browser API, etc. -->
- Runtime: <!-- Node.js v14, Chrome v83, etc. -->
- Operating System: <!-- Windows, Linux, macOS, etc. -->
+23
View File
@@ -1,3 +1,26 @@
# 2.8.3
[diff](https://github.com/prettier/prettier/compare/2.8.2...2.8.3)
#### Allow self-closing tags on custom elements ([#14170](https://github.com/prettier/prettier/pull/14170) by [@fisker](https://github.com/fisker))
See [Angular v15.1.0 release note](https://github.com/angular/angular/releases/tag/15.1.0) for details.
<!-- prettier-ignore -->
```html
// Input
<app-test/>
// Prettier 2.8.2
SyntaxError: Only void and foreign elements can be self closed "app-test" (1:1)
> 1 | <app-test/>
| ^^^^^^^^^
2 |
// Prettier 2.8.3
<app-test />
```
# 2.8.2
[diff](https://github.com/prettier/prettier/compare/2.8.1...2.8.2)
+13 -13
View File
@@ -29,8 +29,8 @@ See below for examples.
### Global
```html
<script src="https://unpkg.com/prettier@2.8.2/standalone.js"></script>
<script src="https://unpkg.com/prettier@2.8.2/plugins/graphql.js"></script>
<script src="https://unpkg.com/prettier@2.8.3/standalone.js"></script>
<script src="https://unpkg.com/prettier@2.8.3/plugins/graphql.js"></script>
<script>
(async () => {
const formatted = await prettier.format("type Query { hello: String }", {
@@ -47,8 +47,8 @@ Note that the [`unpkg` field](https://unpkg.com/#examples) in Prettier’s `pack
```html
<script type="module">
import * as prettier from "https://unpkg.com/prettier@2.8.2/standalone.mjs";
import pluginGraphql from "https://unpkg.com/prettier@2.8.2/plugins/graphql.mjs";
import * as prettier from "https://unpkg.com/prettier@2.8.3/standalone.mjs";
import pluginGraphql from "https://unpkg.com/prettier@2.8.3/plugins/graphql.mjs";
const formatted = await prettier.format("type Query { hello: String }", {
parser: "graphql",
@@ -61,8 +61,8 @@ Note that the [`unpkg` field](https://unpkg.com/#examples) in Prettier’s `pack
```js
define([
"https://unpkg.com/prettier@2.8.2/standalone.js",
"https://unpkg.com/prettier@2.8.2/plugins/graphql.js",
"https://unpkg.com/prettier@2.8.3/standalone.js",
"https://unpkg.com/prettier@2.8.3/plugins/graphql.js",
], async (prettier, ...plugins) => {
const formatted = await prettier.format("type Query { hello: String }", {
parser: "graphql",
@@ -89,8 +89,8 @@ This syntax doesn’t necessarily work in the browser, but it can be used when b
### Worker
```js
importScripts("https://unpkg.com/prettier@2.8.2/standalone.js");
importScripts("https://unpkg.com/prettier@2.8.2/plugins/graphql.js");
importScripts("https://unpkg.com/prettier@2.8.3/standalone.js");
importScripts("https://unpkg.com/prettier@2.8.3/plugins/graphql.js");
(async () => {
const formatted = await prettier.format("type Query { hello: String }", {
parser: "graphql",
@@ -105,8 +105,8 @@ If you want to format [embedded code](options.md#embedded-language-formatting),
```html
<script type="module">
import * as prettier from "https://unpkg.com/prettier@2.8.2/standalone.mjs";
import pluginBabel from "https://unpkg.com/prettier@2.8.2/plugins/babel.mjs";
import * as prettier from "https://unpkg.com/prettier@2.8.3/standalone.mjs";
import pluginBabel from "https://unpkg.com/prettier@2.8.3/plugins/babel.mjs";
console.log(
await prettier.format("const html=/* HTML */ `<DIV> </DIV>`", {
@@ -122,9 +122,9 @@ The HTML code embedded in JavaScript stays unformatted because the `html` parser
```html
<script type="module">
import * as prettier from "https://unpkg.com/prettier@2.8.2/standalone.mjs";
import pluginBabel from "https://unpkg.com/prettier@2.8.2/plugins/babel.mjs";
import pluginHtml from "https://unpkg.com/prettier@2.8.2/plugins/html.mjs";
import * as prettier from "https://unpkg.com/prettier@2.8.3/standalone.mjs";
import pluginBabel from "https://unpkg.com/prettier@2.8.3/plugins/babel.mjs";
import pluginHtml from "https://unpkg.com/prettier@2.8.3/plugins/html.mjs";
console.log(
await prettier.format("const html=/* HTML */ `<DIV> </DIV>`", {
+1 -1
View File
@@ -142,7 +142,7 @@
"magic-string": "0.27.0",
"npm-run-all": "4.1.5",
"path-browserify": "1.0.1",
"prettier": "2.8.2",
"prettier": "2.8.3",
"pretty-bytes": "6.0.0",
"rollup-plugin-license": "3.0.1",
"semver": "7.3.8",
+11 -11
View File
@@ -17,7 +17,7 @@ import { locStart, locEnd } from "./loc.js";
* @typedef {import('angular-html-parser/lib/compiler/src/ml_parser/parser.js').ParseTreeResult} ParserTreeResult
* @typedef {Omit<import('angular-html-parser').ParseOptions, 'canSelfClose'> & {
* name?: 'html' | 'angular' | 'vue' | 'lwc';
* recognizeSelfClosing?: boolean;
* canSelfClose?: boolean;
* normalizeTagName?: boolean;
* normalizeAttributeName?: boolean;
* shouldParseAsRawText?: (tagName: string, prefix: string, hasParent: boolean, attrs: Array<{
@@ -42,7 +42,7 @@ function ngHtmlParser(
angularHtmlParser,
input,
{
recognizeSelfClosing,
canSelfClose,
normalizeTagName,
normalizeAttributeName,
allowHtmComponentClosingTags,
@@ -61,7 +61,7 @@ function ngHtmlParser(
} = angularHtmlParser;
let { rootNodes, errors } = parse(input, {
canSelfClose: recognizeSelfClosing,
canSelfClose,
allowHtmComponentClosingTags,
isTagNameCaseSensitive,
getTagContentType(tagName, prefix, hasParent, attrs) {
@@ -95,7 +95,7 @@ function ngHtmlParser(
let secondParseResult;
const doSecondParse = () =>
parse(input, {
canSelfClose: recognizeSelfClosing,
canSelfClose,
allowHtmComponentClosingTags,
isTagNameCaseSensitive,
});
@@ -132,13 +132,13 @@ function ngHtmlParser(
}
} else {
// If not Vue SFC, treat as html
recognizeSelfClosing = true;
canSelfClose = true;
normalizeTagName = true;
normalizeAttributeName = true;
allowHtmComponentClosingTags = true;
isTagNameCaseSensitive = false;
const htmlParseResult = parse(input, {
canSelfClose: recognizeSelfClosing,
canSelfClose,
allowHtmComponentClosingTags,
isTagNameCaseSensitive,
});
@@ -384,7 +384,7 @@ function _parse(
*/
function createParser({
name,
recognizeSelfClosing = false,
canSelfClose = false,
normalizeTagName = false,
normalizeAttributeName = false,
allowHtmComponentClosingTags = false,
@@ -399,7 +399,7 @@ function createParser({
text,
{ parser: name, ...options },
{
recognizeSelfClosing,
canSelfClose,
normalizeTagName,
normalizeAttributeName,
allowHtmComponentClosingTags,
@@ -419,15 +419,15 @@ const parser = {
parsers: {
html: createParser({
name: "html",
recognizeSelfClosing: true,
canSelfClose: true,
normalizeTagName: true,
normalizeAttributeName: true,
allowHtmComponentClosingTags: true,
}),
angular: createParser({ name: "angular" }),
angular: createParser({ name: "angular", canSelfClose: true }),
vue: createParser({
name: "vue",
recognizeSelfClosing: true,
canSelfClose: true,
isTagNameCaseSensitive: true,
shouldParseAsRawText(tagName, prefix, hasParent, attrs) {
return (
+4 -5
View File
@@ -18,7 +18,6 @@ import { getPreferredQuote } from "../../common/util.js";
import {
isJsxNode,
rawText,
isLiteral,
isCallExpression,
isStringLiteral,
isBinaryish,
@@ -270,7 +269,7 @@ function printJsxChildren(
) {
const parts = [];
path.each(({ node, next }) => {
if (isLiteral(node)) {
if (node.type === "JSXText") {
const text = rawText(node);
// Contains a non-whitespace character
@@ -782,7 +781,7 @@ function isEmptyJsxElement(node) {
// if there is one text child and does not contain any meaningful text
// we can treat the element as empty.
const child = node.children[0];
return isLiteral(child) && !isMeaningfulJsxText(child);
return child.type === "JSXText" && !isMeaningfulJsxText(child);
}
// Meaningful if it contains non-whitespace characters,
@@ -793,7 +792,7 @@ function isEmptyJsxElement(node) {
*/
function isMeaningfulJsxText(node) {
return (
isLiteral(node) &&
node.type === "JSXText" &&
(containsNonJsxWhitespaceRegex.test(rawText(node)) ||
!/\n/.test(rawText(node)))
);
@@ -803,7 +802,7 @@ function isMeaningfulJsxText(node) {
function isJsxWhitespaceExpression(node) {
return (
node.type === "JSXExpressionContainer" &&
isLiteral(node.expression) &&
isStringLiteral(node.expression) &&
node.expression.value === " " &&
!hasComment(node.expression)
);
+2 -2
View File
@@ -11,7 +11,7 @@ import {
} from "../../document/builders.js";
import UnexpectedNodeError from "../../utils/unexpected-node-error.js";
import {
isLiteral,
isStringLiteral,
getTypeScriptMappedTypeModifier,
shouldPrintComma,
isCallExpression,
@@ -391,7 +391,7 @@ function printTypescript(path, options, print) {
return ["require(", print("expression"), ")"];
case "TSModuleDeclaration": {
const { parent } = path;
const isExternalModule = isLiteral(node.id);
const isExternalModule = isStringLiteral(node.id);
const parentIsDeclaration = parent.type === "TSModuleDeclaration";
const bodyIsDeclaration = node.body?.type === "TSModuleDeclaration";
@@ -0,0 +1,36 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`self-closing.component.html format 1`] = `
====================================options=====================================
parsers: ["angular"]
printWidth: 80
| printWidth
=====================================input======================================
<app-test/>
<app-test />
<app-test
/>
<img>
<img/>
<img />
<img
/>
<div/>
<div />
<div
/>
=====================================output=====================================
<app-test />
<app-test />
<app-test />
<img />
<img />
<img />
<img />
<div />
<div />
<div />
================================================================================
`;
@@ -0,0 +1 @@
run_spec(__dirname, ["angular"]);
@@ -0,0 +1,13 @@
<app-test/>
<app-test />
<app-test
/>
<img>
<img/>
<img />
<img
/>
<div/>
<div />
<div
/>
+5 -1
View File
@@ -57,7 +57,11 @@ const siteConfig = {
},
usePrism: ["javascript", "jsx", "typescript", "ts", "js", "html", "css"],
useEnglishUrl: true,
scripts: ["https://buttons.github.io/buttons.js"],
scripts: [
"https://buttons.github.io/buttons.js",
"https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js",
"/js/code-block-buttons.js",
],
stylesheets: [
"//unpkg.com/@sandhose/prettier-animated-logo@1.0.3/dist/wide.css",
],
+63
View File
@@ -0,0 +1,63 @@
/* "Copy" code block button, style from docusaurus v2 */
.code-block-with-actions {
position: relative;
}
.code-block-actions {
position: absolute;
top: 10px;
right: 10px;
}
.code-block-copy-button {
width: 32px;
height: 32px;
border: 1px solid #dadde1;
border-radius: 6px;
display: flex;
transition: opacity 0.2s ease-in-out;
opacity: 0;
position: relative;
cursor: pointer;
color: #393a34;
background-color: #f6f8fa;
}
.code-block-with-actions:hover .code-block-copy-button {
opacity: 0.4;
}
.code-block-with-actions:hover .code-block-copy-button:hover {
opacity: 1;
}
.code-block-copy-button__icon {
fill: currentColor;
position: absolute;
width: 18px;
height: 18px;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
transition: 0.15s;
}
.code-block-copy-button__icon--copied {
color: #00d600;
opacity: 0;
transform: scale(0.33);
}
.code-block-copy-button--copied .code-block-copy-button__icon--copy {
opacity: 0;
transform: scale(0.33);
}
.code-block-copy-button--copied .code-block-copy-button__icon--copied {
transition-delay: 75ms;
transform: scale(1);
opacity: 1;
}
+57
View File
@@ -0,0 +1,57 @@
/* global ClipboardJS */
"use strict";
(function () {
const CONTAINER_CLASS_NAME = "code-block-with-actions";
const ACTIONS_CONTAINER_CLASS_NAME = "code-block-actions";
const COPY_BUTTON_CLASS_NAME = "code-block-copy-button";
const COPY_BUTTON_COPIED_CLASS_NAME = `${COPY_BUTTON_CLASS_NAME}--copied`;
const COPY_BUTTON_ICON_CLASS_NAME = `${COPY_BUTTON_CLASS_NAME}__icon`;
const COPY_BUTTON_COPY_ICON_CLASS_NAME = `${COPY_BUTTON_ICON_CLASS_NAME}--copy`;
const COPY_BUTTON_COPIED_ICON_CLASS_NAME = `${COPY_BUTTON_ICON_CLASS_NAME}--copied`;
const ARIA_LABEL = "Copy code to clipboard";
const ARIA_LABEL_COPIED = "Copied";
function init(codeBlock) {
const container = codeBlock.parentNode;
container.classList.add(CONTAINER_CLASS_NAME);
const actionsContainer = Object.assign(document.createElement("div"), {
className: ACTIONS_CONTAINER_CLASS_NAME,
});
const copyButton = Object.assign(document.createElement("button"), {
className: COPY_BUTTON_CLASS_NAME,
type: "button",
innerHTML:
`<svg class="${COPY_BUTTON_ICON_CLASS_NAME} ${COPY_BUTTON_COPY_ICON_CLASS_NAME}" viewBox="0 0 24 24"><path d="M19,21H8V7H19M19,5H8A2,2 0 0,0 6,7V21A2,2 0 0,0 8,23H19A2,2 0 0,0 21,21V7A2,2 0 0,0 19,5M16,1H4A2,2 0 0,0 2,3V17H4V3H16V1Z"></path></svg>` +
`<svg class="${COPY_BUTTON_ICON_CLASS_NAME} ${COPY_BUTTON_COPIED_ICON_CLASS_NAME}" viewBox="0 0 24 24"><path d="M21,7L9,19L3.5,13.5L4.91,12.09L9,16.17L19.59,5.59L21,7Z"></path></svg>`,
});
copyButton.setAttribute("aria-label", ARIA_LABEL);
new ClipboardJS(copyButton, { target: () => codeBlock }).on(
"success",
(event) => {
event.clearSelection();
copyButton.classList.add(COPY_BUTTON_COPIED_CLASS_NAME);
copyButton.setAttribute("aria-label", ARIA_LABEL_COPIED);
copyButton.disabled = true;
setTimeout(() => {
copyButton.classList.remove(COPY_BUTTON_COPIED_CLASS_NAME);
copyButton.setAttribute("aria-label", ARIA_LABEL);
copyButton.disabled = false;
}, 2000);
}
);
actionsContainer.appendChild(copyButton);
container.appendChild(actionsContainer);
}
window.addEventListener("load", () => {
for (const codeBlock of document.querySelectorAll("pre > code.hljs")) {
init(codeBlock);
}
});
})();
@@ -21,8 +21,8 @@ Required options:
- **`plugins`**: Unlike the `format` function from the [Node.js-based API](api.md#prettierformatsource--options), this function doesn’t load plugins automatically. The `plugins` option is required because all the parsers included in the Prettier package come as plugins (for reasons of file size). These plugins are files named
- `parser-*.js` in <https://unpkg.com/browse/prettier@2.8.2/> and
- `parser-*.mjs` in <https://unpkg.com/browse/prettier@2.8.2/esm/>
- `parser-*.js` in <https://unpkg.com/browse/prettier@2.8.3/> and
- `parser-*.mjs` in <https://unpkg.com/browse/prettier@2.8.3/esm/>
You need to load the ones that you’re going to use and pass them to `prettier.format` using the `plugins` option.
@@ -33,8 +33,8 @@ See below for examples.
### Global
```html
<script src="https://unpkg.com/prettier@2.8.2/standalone.js"></script>
<script src="https://unpkg.com/prettier@2.8.2/parser-graphql.js"></script>
<script src="https://unpkg.com/prettier@2.8.3/standalone.js"></script>
<script src="https://unpkg.com/prettier@2.8.3/parser-graphql.js"></script>
<script>
prettier.format("type Query { hello: String }", {
parser: "graphql",
@@ -49,8 +49,8 @@ Note that the [`unpkg` field](https://unpkg.com/#examples) in Prettier’s `pack
```html
<script type="module">
import prettier from "https://unpkg.com/prettier@2.8.2/esm/standalone.mjs";
import parserGraphql from "https://unpkg.com/prettier@2.8.2/esm/parser-graphql.mjs";
import prettier from "https://unpkg.com/prettier@2.8.3/esm/standalone.mjs";
import parserGraphql from "https://unpkg.com/prettier@2.8.3/esm/parser-graphql.mjs";
prettier.format("type Query { hello: String }", {
parser: "graphql",
@@ -63,8 +63,8 @@ Note that the [`unpkg` field](https://unpkg.com/#examples) in Prettier’s `pack
```js
define([
"https://unpkg.com/prettier@2.8.2/standalone.js",
"https://unpkg.com/prettier@2.8.2/parser-graphql.js",
"https://unpkg.com/prettier@2.8.3/standalone.js",
"https://unpkg.com/prettier@2.8.3/parser-graphql.js",
], (prettier, ...plugins) => {
prettier.format("type Query { hello: String }", {
parser: "graphql",
@@ -89,8 +89,8 @@ This syntax doesn’t necessarily work in the browser, but it can be used when b
### Worker
```js
importScripts("https://unpkg.com/prettier@2.8.2/standalone.js");
importScripts("https://unpkg.com/prettier@2.8.2/parser-graphql.js");
importScripts("https://unpkg.com/prettier@2.8.3/standalone.js");
importScripts("https://unpkg.com/prettier@2.8.3/parser-graphql.js");
prettier.format("type Query { hello: String }", {
parser: "graphql",
plugins: prettierPlugins,
@@ -103,8 +103,8 @@ If you want to format [embedded code](options.md#embedded-language-formatting),
```html
<script type="module">
import prettier from "https://unpkg.com/prettier@2.8.2/esm/standalone.mjs";
import parserBabel from "https://unpkg.com/prettier@2.8.2/esm/parser-babel.mjs";
import prettier from "https://unpkg.com/prettier@2.8.3/esm/standalone.mjs";
import parserBabel from "https://unpkg.com/prettier@2.8.3/esm/parser-babel.mjs";
console.log(
prettier.format("const html=/* HTML */ `<DIV> </DIV>`", {
@@ -120,9 +120,9 @@ The HTML code embedded in JavaScript stays unformatted because the `html` parser
```html
<script type="module">
import prettier from "https://unpkg.com/prettier@2.8.2/esm/standalone.mjs";
import parserBabel from "https://unpkg.com/prettier@2.8.2/esm/parser-babel.mjs";
import parserHtml from "https://unpkg.com/prettier@2.8.2/esm/parser-html.mjs";
import prettier from "https://unpkg.com/prettier@2.8.3/esm/standalone.mjs";
import parserBabel from "https://unpkg.com/prettier@2.8.3/esm/parser-babel.mjs";
import parserHtml from "https://unpkg.com/prettier@2.8.3/esm/parser-html.mjs";
console.log(
prettier.format("const html=/* HTML */ `<DIV> </DIV>`", {
+3 -3
View File
@@ -3380,9 +3380,9 @@ __metadata:
linkType: hard
"date-fns@npm:^2.29.1":
version: 2.29.2
resolution: "date-fns@npm:2.29.2"
checksum: 08bebcceb0a5dbadae4c55e6592b9d5c07dbd7833433c7e9a1d4a424300db32589b8b48e5979b32863c9b00a48d9bab6663e580c2a4f9f203d46cbf9113b5664
version: 2.29.3
resolution: "date-fns@npm:2.29.3"
checksum: e01cf5b62af04e05dfff921bb9c9933310ed0e1ae9a81eb8653452e64dc841acf7f6e01e1a5ae5644d0337e9a7f936175fd2cb6819dc122fdd9c5e86c56be484
languageName: node
linkType: hard
+5 -5
View File
@@ -6710,12 +6710,12 @@ __metadata:
languageName: node
linkType: hard
"prettier@npm:2.8.2":
version: 2.8.2
resolution: "prettier@npm:2.8.2"
"prettier@npm:2.8.3":
version: 2.8.3
resolution: "prettier@npm:2.8.3"
bin:
prettier: bin-prettier.js
checksum: 740c56c2128d587d656ea1dde9bc9c3503dfc94db4f3ac387259215eeb2e216680bdad9d18a0c9feecc6b42cfa188d6fa777df4c36c1d00cedd4199074fbfbd2
checksum: 92f2ceb522d454370e02082aa74ad27388672f7cee8975028b59517c069fe643bdc73e322675c8faf2ff173d7a626d1a6389f26b474000308e793aa25fff46e5
languageName: node
linkType: hard
@@ -6820,7 +6820,7 @@ __metadata:
postcss-scss: 4.0.6
postcss-selector-parser: 2.2.3
postcss-values-parser: 2.0.1
prettier: 2.8.2
prettier: 2.8.3
pretty-bytes: 6.0.0
regexp-util: 1.2.2
remark-footnotes: 2.0.0