Просмотр исходного кода

don't wrap CSS contents with the media query given as attribute of style elements

Gildas 7 лет назад
Родитель
Сommit
ce039a727b
2 измененных файлов с 21 добавлено и 19 удалено
  1. 18 16
      lib/single-file/css-medias-minifier.js
  2. 3 3
      lib/single-file/single-file-core.js

+ 18 - 16
lib/single-file/css-medias-minifier.js

@@ -27,29 +27,31 @@ this.mediasMinifier = this.mediasMinifier || (() => {
 			const stats = { processed: 0, discarded: 0 };
 			doc.querySelectorAll("style").forEach(styleElement => {
 				if (styleElement.sheet) {
-					styleElement.textContent = processRules(doc, styleElement.sheet.cssRules, stats);
+					styleElement.textContent = processRules(doc, styleElement.sheet.cssRules, styleElement.media || "all", stats);
 				}
 			});
 			return stats;
 		}
 	};
 
-	function processRules(doc, cssRules, stats) {
+	function processRules(doc, cssRules, media, stats) {
 		let sheetContent = "";
-		Array.from(cssRules).forEach(cssRule => {
-			if (cssRule.type == CSSRule.MEDIA_RULE) {
-				stats.processed++;
-				if (matchesMediaType(cssRule.media, "screen")) {
-					sheetContent += "@media " + Array.from(cssRule.media).join(",") + "{";
-					sheetContent += processRules(doc, cssRule.cssRules, stats);
-					sheetContent += "}";
+		if (matchesMediaType(media, "screen")) {
+			Array.from(cssRules).forEach(cssRule => {
+				if (cssRule.type == CSSRule.MEDIA_RULE) {
+					stats.processed++;
+					if (matchesMediaType(cssRule.media.mediaText, "screen")) {
+						sheetContent += "@media " + Array.from(cssRule.media).join(",") + "{";
+						sheetContent += processRules(doc, cssRule.cssRules, cssRule.media.mediaText, stats);
+						sheetContent += "}";
+					} else {
+						stats.discarded++;
+					}
 				} else {
-					stats.discarded++;
+					sheetContent += cssRule.cssText;
 				}
-			} else {
-				sheetContent += cssRule.cssText;
-			}
-		});
+			});
+		}
 		return sheetContent;
 	}
 
@@ -57,8 +59,8 @@ this.mediasMinifier = this.mediasMinifier || (() => {
 		return array.reduce((a, b) => a.concat(Array.isArray(b) ? flatten(b) : b), []);
 	}
 
-	function matchesMediaType(media, mediaType) {
-		const foundMediaTypes = flatten(mediaQueryParser.parseMediaList(media.mediaText).map(node => getMediaTypes(node, mediaType)));
+	function matchesMediaType(mediaText, mediaType) {
+		const foundMediaTypes = flatten(mediaQueryParser.parseMediaList(mediaText).map(node => getMediaTypes(node, mediaType)));
 		return foundMediaTypes.find(mediaTypeInfo => (!mediaTypeInfo.not && (mediaTypeInfo.value == mediaType || mediaTypeInfo.value == "all")) || (mediaTypeInfo.not && (mediaTypeInfo.value == "all" || mediaTypeInfo.value != mediaType)));
 	}
 

+ 3 - 3
lib/single-file/single-file-core.js

@@ -849,8 +849,9 @@ this.SingleFileCore = this.SingleFileCore || (() => {
 		async resolveLinkedStylesheetURLs() {
 			await Promise.all(Array.from(this.doc.querySelectorAll("link[rel*=stylesheet]")).map(async linkElement => {
 				const options = { maxResourceSize: this.options.maxResourceSize, maxResourceSizeEnabled: this.options.maxResourceSizeEnabled, charSet: this.charSet };
-				const stylesheetContent = await DomProcessorHelper.resolveLinkStylesheetURLs(linkElement.href, this.baseURI, linkElement.media, options);
+				const stylesheetContent = await DomProcessorHelper.resolveLinkStylesheetURLs(linkElement.href, this.baseURI, options);
 				const styleElement = this.doc.createElement("style");
+				styleElement.media = linkElement.media;
 				styleElement.textContent = stylesheetContent;
 				linkElement.parentElement.replaceChild(styleElement, linkElement);
 			}));
@@ -1037,12 +1038,11 @@ this.SingleFileCore = this.SingleFileCore || (() => {
 			return stylesheetContent;
 		}
 
-		static async resolveLinkStylesheetURLs(resourceURL, baseURI, media, options) {
+		static async resolveLinkStylesheetURLs(resourceURL, baseURI, options) {
 			resourceURL = DomUtil.normalizeURL(resourceURL);
 			if (resourceURL && resourceURL != baseURI && resourceURL != ABOUT_BLANK_URI) {
 				let stylesheetContent = await Download.getContent(resourceURL, { asDataURI: false, maxResourceSize: options.maxResourceSize, maxResourceSizeEnabled: options.maxResourceSizeEnabled, charSet: options.charSet });
 				stylesheetContent = await DomProcessorHelper.resolveImportURLs(stylesheetContent, resourceURL, options);
-				stylesheetContent = DomUtil.wrapMediaQuery(stylesheetContent, media);
 				return stylesheetContent;
 			}
 		}