prettier: Custom css URI functions are breaking

Prettier 1.13.4 Playground link

--parser css

Input:

div {
  background: -fb-datauri(/intern/images/org/product/default-image.png);
  background: -fb-datauri(/intern/images/organization/product/default-image.png);
}

Output:

div {
  background: -fb-datauri(/ intern/images/org/product/default-image.png);
  background: -fb-datauri(
    / intern/images/organization/product/default-image.png
  );
}

This is not urgent but would be nice to find a way not to put a space after the first /. I remember that we are doing some custom things for urls, maybe we can whitelist everything that ends with url/uri as a heuristic?

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 1
Comments: 19 (16 by maintainers)

Most upvoted comments

Same problem https://github.com/prettier/prettier/issues/2835, try to fix both problem tommorow

alexander-akait on Jun 6, 2018

@vjeux If it’s possible to quote the URLs you can use that as a workaround.

Prettier 1.13.4 Playground link

--parser css

Input:

div {
  background: -fb-datauri("/intern/images/org/product/default-image.png");
  background: -fb-datauri("/intern/images/organization/product/default-image.png");
}

Output:

div {
  background: -fb-datauri("/intern/images/org/product/default-image.png");
  background: -fb-datauri(
    "/intern/images/organization/product/default-image.png"
  );
}

lydell on Jun 6, 2018

@vjeux because -fb-datauri is considered as not url function. But we can handle this as url.

alexander-akait on Jun 6, 2018