1
0
Fork 0
mirror of https://github.com/denoland/deno.git synced 2024-11-27 16:10:57 -05:00

feat(fmt): support CSS, SCSS, Sass and Less (#24870)

This PR integrates [Malva](https://github.com/g-plane/malva) into `deno
fmt`, which introduces the ability to format CSS, SCSS, Sass and Less
files.

On Linux x64 6.10, this PR increases about 800KiB:

```                                                                                                                                                                      
❯ wc -c target/release/deno
125168728 target/release/deno

❯ wc -c target/release/deno
124349456 target/release/deno
```
This commit is contained in:
Pig Fang 2024-08-10 00:52:23 +08:00 committed by GitHub
parent 218ee1b1ff
commit 82884348cb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 235 additions and 10 deletions

52
Cargo.lock generated
View file

@ -456,7 +456,7 @@ dependencies = [
"bitflags 2.5.0",
"cexpr",
"clang-sys",
"itertools",
"itertools 0.10.5",
"lazy_static",
"lazycell",
"log",
@ -1186,6 +1186,7 @@ dependencies = [
"libz-sys",
"log",
"lsp-types",
"malva",
"memmem",
"monch",
"napi_sym",
@ -1612,7 +1613,7 @@ dependencies = [
"hyper 0.14.28",
"hyper 1.4.1",
"hyper-util",
"itertools",
"itertools 0.10.5",
"memmem",
"mime",
"once_cell",
@ -3852,6 +3853,15 @@ dependencies = [
"either",
]
[[package]]
name = "itertools"
version = "0.13.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "413ee7dfc52ee1a4949ceeb7dbc8a33f2d6c088194d9f922fb8318faf1f01186"
dependencies = [
"either",
]
[[package]]
name = "itoa"
version = "1.0.11"
@ -4235,6 +4245,19 @@ dependencies = [
"libc",
]
[[package]]
name = "malva"
version = "0.8.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "bf982faadf37679302c3fcd8d843d29bf4bb4d323323cffb2f5217ad39578470"
dependencies = [
"aho-corasick",
"itertools 0.13.0",
"memchr",
"raffia",
"tiny_pretty",
]
[[package]]
name = "maplit"
version = "1.0.2"
@ -5290,7 +5313,7 @@ checksum = "119533552c9a7ffacc21e099c24a0ac8bb19c2a2a3f363de84cd9b844feab270"
dependencies = [
"bytes",
"heck 0.4.1",
"itertools",
"itertools 0.10.5",
"lazy_static",
"log",
"multimap",
@ -5311,7 +5334,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "e5d2d8d10f3c6ded6da8b05b5fb3b8a5082514344d56c9f871412d29b4e075b4"
dependencies = [
"anyhow",
"itertools",
"itertools 0.10.5",
"proc-macro2",
"quote",
"syn 1.0.109",
@ -5473,6 +5496,27 @@ dependencies = [
"nibble_vec",
]
[[package]]
name = "raffia"
version = "0.9.0"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "6a26ea01d105c934a90ddd1fca6a343bec14e1a24b72126ee6f364f5a5dd5ec2"
dependencies = [
"raffia_macro",
"smallvec",
]
[[package]]
name = "raffia_macro"
version = "0.1.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "4fdb50eb5bf734fa5a770680a61876a6ec77b99c1e0e52d1f18ad6ebfa85759f"
dependencies = [
"heck 0.5.0",
"quote",
"syn 2.0.72",
]
[[package]]
name = "rand"
version = "0.8.5"

View file

@ -123,6 +123,7 @@ libc.workspace = true
libz-sys.workspace = true
log = { workspace = true, features = ["serde"] }
lsp-types.workspace = true
malva = "=0.8.0"
memmem.workspace = true
monch.workspace = true
notify.workspace = true

View file

@ -200,6 +200,7 @@ pub struct FmtFlags {
pub prose_wrap: Option<String>,
pub no_semicolons: Option<bool>,
pub watch: Option<WatchFlags>,
pub unstable_css: bool,
pub unstable_yaml: bool,
}
@ -2018,8 +2019,8 @@ Ignore formatting a file by adding an ignore comment at the top of the file:
// prefer using ts for formatting instead of js because ts works in more scenarios
.default_value("ts")
.value_parser([
"ts", "tsx", "js", "jsx", "md", "json", "jsonc", "yml", "yaml",
"ipynb",
"ts", "tsx", "js", "jsx", "md", "json", "jsonc", "css", "scss",
"sass", "less", "yml", "yaml", "ipynb",
]),
)
.arg(
@ -2096,6 +2097,13 @@ Ignore formatting a file by adding an ignore comment at the top of the file:
"Don't use semicolons except where necessary. Defaults to false.",
),
)
.arg(
Arg::new("unstable-css")
.long("unstable-css")
.help("Enable formatting CSS, SCSS, Sass and Less files.")
.value_parser(FalseyValueParser::new())
.action(ArgAction::SetTrue),
)
.arg(
Arg::new("unstable-yaml")
.long("unstable-yaml")
@ -4163,6 +4171,7 @@ fn fmt_parse(flags: &mut Flags, matches: &mut ArgMatches) {
let single_quote = matches.remove_one::<bool>("single-quote");
let prose_wrap = matches.remove_one::<String>("prose-wrap");
let no_semicolons = matches.remove_one::<bool>("no-semicolons");
let unstable_css = matches.get_flag("unstable-css");
let unstable_yaml = matches.get_flag("unstable-yaml");
flags.subcommand = DenoSubcommand::Fmt(FmtFlags {
@ -4175,6 +4184,7 @@ fn fmt_parse(flags: &mut Flags, matches: &mut ArgMatches) {
prose_wrap,
no_semicolons,
watch: watch_arg_parse(matches),
unstable_css,
unstable_yaml,
});
}
@ -5881,6 +5891,7 @@ mod tests {
single_quote: None,
prose_wrap: None,
no_semicolons: None,
unstable_css: false,
unstable_yaml: false,
watch: Default::default(),
}),
@ -5905,6 +5916,7 @@ mod tests {
single_quote: None,
prose_wrap: None,
no_semicolons: None,
unstable_css: false,
unstable_yaml: false,
watch: Default::default(),
}),
@ -5929,6 +5941,7 @@ mod tests {
single_quote: None,
prose_wrap: None,
no_semicolons: None,
unstable_css: false,
unstable_yaml: false,
watch: Default::default(),
}),
@ -5953,6 +5966,7 @@ mod tests {
single_quote: None,
prose_wrap: None,
no_semicolons: None,
unstable_css: false,
unstable_yaml: false,
watch: Some(Default::default()),
}),
@ -5966,6 +5980,7 @@ mod tests {
"fmt",
"--watch",
"--no-clear-screen",
"--unstable-css",
"--unstable-yaml"
]);
assert_eq!(
@ -5983,6 +5998,7 @@ mod tests {
single_quote: None,
prose_wrap: None,
no_semicolons: None,
unstable_css: true,
unstable_yaml: true,
watch: Some(WatchFlags {
hmr: false,
@ -6018,6 +6034,7 @@ mod tests {
single_quote: None,
prose_wrap: None,
no_semicolons: None,
unstable_css: false,
unstable_yaml: false,
watch: Some(Default::default()),
}),
@ -6042,6 +6059,7 @@ mod tests {
single_quote: None,
prose_wrap: None,
no_semicolons: None,
unstable_css: false,
unstable_yaml: false,
watch: Default::default(),
}),
@ -6074,6 +6092,7 @@ mod tests {
single_quote: None,
prose_wrap: None,
no_semicolons: None,
unstable_css: false,
unstable_yaml: false,
watch: Some(Default::default()),
}),
@ -6111,6 +6130,7 @@ mod tests {
single_quote: Some(true),
prose_wrap: Some("never".to_string()),
no_semicolons: Some(true),
unstable_css: false,
unstable_yaml: false,
watch: Default::default(),
}),
@ -6142,6 +6162,7 @@ mod tests {
single_quote: Some(false),
prose_wrap: None,
no_semicolons: Some(false),
unstable_css: false,
unstable_yaml: false,
watch: Default::default(),
}),

View file

@ -281,6 +281,7 @@ impl BenchOptions {
#[derive(Clone, Debug, Default, PartialEq, Eq, Hash)]
pub struct UnstableFmtOptions {
pub css: bool,
pub yaml: bool,
}
@ -314,6 +315,7 @@ impl FmtOptions {
Self {
options: resolve_fmt_options(fmt_flags, fmt_config.options),
unstable: UnstableFmtOptions {
css: unstable.css || fmt_flags.unstable_css,
yaml: unstable.yaml || fmt_flags.unstable_yaml,
},
files: fmt_config.files,
@ -1330,8 +1332,10 @@ impl CliOptions {
}
pub fn resolve_config_unstable_fmt_options(&self) -> UnstableFmtOptions {
let workspace = self.workspace();
UnstableFmtOptions {
yaml: self.workspace().has_unstable("fmt-yaml"),
css: workspace.has_unstable("fmt-css"),
yaml: workspace.has_unstable("fmt-yaml"),
}
}
@ -1664,6 +1668,7 @@ impl CliOptions {
"sloppy-imports",
"byonm",
"bare-node-builtins",
"fmt-css",
"fmt-yaml",
]);
// add more unstable flags to the same vector holding granular flags

View file

@ -1368,6 +1368,9 @@ impl Inner {
.data_for_specifier(&specifier)
.map(|d| &d.member_dir.workspace);
let unstable_options = UnstableFmtOptions {
css: maybe_workspace
.map(|w| w.has_unstable("fmt-css"))
.unwrap_or(false),
yaml: maybe_workspace
.map(|w| w.has_unstable("fmt-yaml"))
.unwrap_or(false),

View file

@ -244,6 +244,10 @@ fn format_markdown(
| "typescript"
| "json"
| "jsonc"
| "css"
| "scss"
| "sass"
| "less"
| "yml"
| "yaml"
) {
@ -263,6 +267,13 @@ fn format_markdown(
json_config.line_width = line_width;
dprint_plugin_json::format_text(&fake_filename, text, &json_config)
}
"css" | "scss" | "sass" | "less" => {
if unstable_options.css {
format_css(&fake_filename, text, fmt_options)
} else {
Ok(None)
}
}
"yml" | "yaml" => {
if unstable_options.yaml {
pretty_yaml::format_text(
@ -305,6 +316,20 @@ pub fn format_json(
dprint_plugin_json::format_text(file_path, file_text, &config)
}
pub fn format_css(
file_path: &Path,
file_text: &str,
fmt_options: &FmtOptionsConfig,
) -> Result<Option<String>, AnyError> {
malva::format_text(
file_text,
malva::detect_syntax(file_path).unwrap_or(malva::Syntax::Css),
&get_resolved_malva_config(fmt_options),
)
.map(Some)
.map_err(AnyError::from)
}
/// Formats a single TS, TSX, JS, JSX, JSONC, JSON, MD, or IPYNB file.
pub fn format_file(
file_path: &Path,
@ -319,6 +344,13 @@ pub fn format_file(
format_markdown(file_text, fmt_options, unstable_options)
}
"json" | "jsonc" => format_json(file_path, file_text, fmt_options),
"css" | "scss" | "sass" | "less" => {
if unstable_options.css {
format_css(file_path, file_text, fmt_options)
} else {
Ok(None)
}
}
"yml" | "yaml" => {
if unstable_options.yaml {
pretty_yaml::format_text(
@ -737,6 +769,58 @@ fn get_resolved_json_config(
builder.build()
}
fn get_resolved_malva_config(
options: &FmtOptionsConfig,
) -> malva::config::FormatOptions {
use malva::config::*;
let layout_options = LayoutOptions {
print_width: options.line_width.unwrap_or(80) as usize,
use_tabs: options.use_tabs.unwrap_or_default(),
indent_width: options.indent_width.unwrap_or(2) as usize,
line_break: LineBreak::Lf,
};
let language_options = LanguageOptions {
hex_case: HexCase::Lower,
hex_color_length: None,
quotes: if let Some(true) = options.single_quote {
Quotes::PreferSingle
} else {
Quotes::PreferDouble
},
operator_linebreak: OperatorLineBreak::Before,
block_selector_linebreak: BlockSelectorLineBreak::Consistent,
omit_number_leading_zero: false,
trailing_comma: true,
format_comments: false,
linebreak_in_pseudo_parens: true,
declaration_order: None,
single_line_block_threshold: None,
keyframe_selector_notation: None,
attr_value_quotes: AttrValueQuotes::Always,
prefer_single_line: false,
selectors_prefer_single_line: None,
function_args_prefer_single_line: None,
sass_content_at_rule_prefer_single_line: None,
sass_include_at_rule_prefer_single_line: None,
sass_map_prefer_single_line: None,
sass_module_config_prefer_single_line: None,
sass_params_prefer_single_line: None,
less_import_options_prefer_single_line: None,
less_mixin_args_prefer_single_line: None,
less_mixin_params_prefer_single_line: None,
top_level_declarations_prefer_single_line: None,
selector_override_comment_directive: "deno-fmt-selector-override".into(),
ignore_comment_directive: "deno-fmt-ignore".into(),
};
FormatOptions {
layout: layout_options,
language: language_options,
}
}
fn get_resolved_yaml_config(
options: &FmtOptionsConfig,
) -> pretty_yaml::config::FormatOptions {
@ -864,6 +948,10 @@ fn is_supported_ext_fmt(path: &Path) -> bool {
| "mts"
| "json"
| "jsonc"
| "css"
| "scss"
| "sass"
| "less"
| "md"
| "mkd"
| "mkdn"
@ -906,6 +994,14 @@ mod test {
assert!(is_supported_ext_fmt(Path::new("foo.JSONC")));
assert!(is_supported_ext_fmt(Path::new("foo.json")));
assert!(is_supported_ext_fmt(Path::new("foo.JsON")));
assert!(is_supported_ext_fmt(Path::new("foo.css")));
assert!(is_supported_ext_fmt(Path::new("foo.Css")));
assert!(is_supported_ext_fmt(Path::new("foo.scss")));
assert!(is_supported_ext_fmt(Path::new("foo.SCSS")));
assert!(is_supported_ext_fmt(Path::new("foo.sass")));
assert!(is_supported_ext_fmt(Path::new("foo.Sass")));
assert!(is_supported_ext_fmt(Path::new("foo.less")));
assert!(is_supported_ext_fmt(Path::new("foo.LeSS")));
assert!(is_supported_ext_fmt(Path::new("foo.yml")));
assert!(is_supported_ext_fmt(Path::new("foo.Yml")));
assert!(is_supported_ext_fmt(Path::new("foo.yaml")));

View file

@ -31,6 +31,12 @@ fn fmt_test() {
let badly_formatted_json = t.path().join("badly_formatted.json");
badly_formatted_original_json.copy(&badly_formatted_json);
let fixed_css = testdata_fmt_dir.join("badly_formatted_fixed.css");
let badly_formatted_original_css =
testdata_fmt_dir.join("badly_formatted.css");
let badly_formatted_css = t.path().join("badly_formatted.css");
badly_formatted_original_css.copy(&badly_formatted_css);
let fixed_ipynb = testdata_fmt_dir.join("badly_formatted_fixed.ipynb");
let badly_formatted_original_ipynb =
testdata_fmt_dir.join("badly_formatted.ipynb");
@ -49,12 +55,13 @@ fn fmt_test() {
.current_dir(&testdata_fmt_dir)
.args_vec(vec![
"fmt".to_string(),
"--unstable-css".to_string(),
"--unstable-yaml".to_string(),
format!(
"--ignore={badly_formatted_js},{badly_formatted_md},{badly_formatted_json},{badly_formatted_yaml},{badly_formatted_ipynb}",
"--ignore={badly_formatted_js},{badly_formatted_md},{badly_formatted_json},{badly_formatted_css},{badly_formatted_yaml},{badly_formatted_ipynb}",
),
format!(
"--check {badly_formatted_js} {badly_formatted_md} {badly_formatted_json} {badly_formatted_yaml} {badly_formatted_ipynb}",
"--check {badly_formatted_js} {badly_formatted_md} {badly_formatted_json} {badly_formatted_css} {badly_formatted_yaml} {badly_formatted_ipynb}",
),
])
.run();
@ -70,10 +77,12 @@ fn fmt_test() {
.args_vec(vec![
"fmt".to_string(),
"--check".to_string(),
"--unstable-css".to_string(),
"--unstable-yaml".to_string(),
badly_formatted_js.to_string(),
badly_formatted_md.to_string(),
badly_formatted_json.to_string(),
badly_formatted_css.to_string(),
badly_formatted_yaml.to_string(),
badly_formatted_ipynb.to_string(),
])
@ -88,10 +97,12 @@ fn fmt_test() {
.current_dir(&testdata_fmt_dir)
.args_vec(vec![
"fmt".to_string(),
"--unstable-css".to_string(),
"--unstable-yaml".to_string(),
badly_formatted_js.to_string(),
badly_formatted_md.to_string(),
badly_formatted_json.to_string(),
badly_formatted_css.to_string(),
badly_formatted_yaml.to_string(),
badly_formatted_ipynb.to_string(),
])
@ -103,16 +114,19 @@ fn fmt_test() {
let expected_js = fixed_js.read_to_string();
let expected_md = fixed_md.read_to_string();
let expected_json = fixed_json.read_to_string();
let expected_css = fixed_css.read_to_string();
let expected_yaml = fixed_yaml.read_to_string();
let expected_ipynb = fixed_ipynb.read_to_string();
let actual_js = badly_formatted_js.read_to_string();
let actual_md = badly_formatted_md.read_to_string();
let actual_json = badly_formatted_json.read_to_string();
let actual_css = badly_formatted_css.read_to_string();
let actual_yaml = badly_formatted_yaml.read_to_string();
let actual_ipynb = badly_formatted_ipynb.read_to_string();
assert_eq!(expected_js, actual_js);
assert_eq!(expected_md, actual_md);
assert_eq!(expected_json, actual_json);
assert_eq!(expected_css, actual_css);
assert_eq!(expected_yaml, actual_yaml);
assert_eq!(expected_ipynb, actual_ipynb);
}

View file

@ -0,0 +1,25 @@
{
"tempDir": true,
"tests": {
"nothing": {
"args": "fmt",
"output": "Checked 1 file\n"
},
"flag": {
"args": "fmt --unstable-css",
"output": "[WILDLINE]badly_formatted.css\nChecked 1 file\n"
},
"config_file": {
"steps": [{
"args": [
"eval",
"Deno.writeTextFile('deno.json', '{\\n \"unstable\": [\"fmt-css\"]\\n}\\n')"
],
"output": "[WILDCARD]"
}, {
"args": "fmt",
"output": "[WILDLINE]badly_formatted.css\nChecked 2 files\n"
}]
}
}
}

View file

@ -0,0 +1 @@
#app>.btn{ color : #000 }

View file

@ -0,0 +1,2 @@
#app>.btn{ color : #000 }

View file

@ -49,3 +49,7 @@ function foo(): number {
- item1
- item2
```
```css
#app>.btn{ color : #000 }
```

View file

@ -0,0 +1,3 @@
#app > .btn {
color: #000;
}

View file

@ -40,3 +40,9 @@ function foo(): number {
- item1
- item2
```
```css
#app > .btn {
color: #000;
}
```