Always use quotes in CSS urls

This commit is contained in:
Joseph Garrone 2024-07-14 16:58:35 +02:00
parent a147084458
commit d8e3fdeb14
2 changed files with 14 additions and 14 deletions

View File

@ -37,7 +37,7 @@ export function replaceImportsInCssCode(params: {
break inline_style_in_html;
}
return `url(\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}${assetFileAbsoluteUrlPathname})`;
return `url("\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}${assetFileAbsoluteUrlPathname}")`;
}
const assetFileRelativeUrlPathname = posix.relative(
@ -45,7 +45,7 @@ export function replaceImportsInCssCode(params: {
assetFileAbsoluteUrlPathname.replace(/^\//, "")
);
return `url(${assetFileRelativeUrlPathname})`;
return `url("${assetFileRelativeUrlPathname}")`;
}
);

View File

@ -403,15 +403,15 @@ describe("css replacer", () => {
const fixedCssCodeExpected = `
.my-div {
background: url(../background.png) no-repeat center center;
background: url("../background.png") no-repeat center center;
}
.my-div2 {
background: url(background.png) repeat center center;
background: url("background.png") repeat center center;
}
.my-div3 {
background-image: url(media/something.svg);
background-image: url("media/something.svg");
}
`;
@ -441,15 +441,15 @@ describe("css replacer", () => {
const fixedCssCodeExpected = `
.my-div {
background: url(../background.png) no-repeat center center;
background: url("../background.png") no-repeat center center;
}
.my-div2 {
background: url(background.png) repeat center center;
background: url("background.png") repeat center center;
}
.my-div3 {
background-image: url(media/something.svg);
background-image: url("media/something.svg");
}
`;
@ -479,15 +479,15 @@ describe("css replacer", () => {
const fixedCssCodeExpected = `
.my-div {
background: url(\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/background.png) no-repeat center center;
background: url("\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/background.png") no-repeat center center;
}
.my-div2 {
background: url(\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/assets/background.png) repeat center center;
background: url("\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/assets/background.png") repeat center center;
}
.my-div3 {
background-image: url(\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/assets/media/something.svg);
background-image: url("\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/assets/media/something.svg");
}
`;
@ -517,15 +517,15 @@ describe("css replacer", () => {
const fixedCssCodeExpected = `
.my-div {
background: url(\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/background.png) no-repeat center center;
background: url("\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/background.png") no-repeat center center;
}
.my-div2 {
background: url(\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/assets/background.png) repeat center center;
background: url("\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/assets/background.png") repeat center center;
}
.my-div3 {
background-image: url(\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/assets/media/something.svg);
background-image: url("\${xKeycloakify.resourcesPath}/${BASENAME_OF_KEYCLOAKIFY_RESOURCES_DIR}/assets/media/something.svg");
}
`;