You've already forked joplin
							
							
				mirror of
				https://github.com/laurent22/joplin.git
				synced 2025-10-31 00:07:48 +02:00 
			
		
		
		
	Clipper: Fixes #1682: Do not clip elements that should be hidden
This commit is contained in:
		| @@ -87,16 +87,17 @@ | ||||
| 	} | ||||
|  | ||||
| 	// Cleans up element by removing all its invisible children (which we don't want to render as Markdown) | ||||
| 	// And hard-code the image dimensions so that the information can be used by the clipper server to | ||||
| 	// display them at the right sizes in the notes. | ||||
| 	function cleanUpElement(element, imageSizes) { | ||||
| 		const childNodes = element.childNodes; | ||||
|  | ||||
| 		for (let i = 0; i < childNodes.length; i++) { | ||||
| 		for (let i = childNodes.length - 1; i >= 0; i--) { | ||||
| 			const node = childNodes[i]; | ||||
|  | ||||
| 			let isVisible = node.nodeType === 1 ? window.getComputedStyle(node).display !== 'none' : true; | ||||
| 			if (isVisible && ['input', 'textarea', 'script', 'noscript', 'style', 'select', 'option', 'button'].indexOf(node.nodeName.toLowerCase()) >= 0) isVisible = false; | ||||
| 			const isHidden = node && node.classList && node.classList.contains('joplin-clipper-hidden'); | ||||
|  | ||||
| 			if (!isVisible) { | ||||
| 			if (isHidden) { | ||||
| 				element.removeChild(node); | ||||
| 			} else { | ||||
|  | ||||
| @@ -114,6 +115,27 @@ | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
| 	// When we clone the document before cleaning it, we lose some of the information that might have been set via CSS or | ||||
| 	// JavaScript, in particular whether an element was hidden or not. This function pre-process the document by | ||||
| 	// adding a "joplin-clipper-hidden" class to all currently hidden elements in the current document. | ||||
| 	// This class is then used in cleanUpElement() on the cloned document to find an element should be visible or not. | ||||
| 	function hardcodeDisplayStyles(element) { | ||||
| 		const childNodes = element.childNodes; | ||||
|  | ||||
| 		for (let i = 0; i < childNodes.length; i++) { | ||||
| 			const node = childNodes[i]; | ||||
|  | ||||
| 			let isVisible = node.nodeType === 1 ? window.getComputedStyle(node).display !== 'none' : true; | ||||
| 			if (isVisible && ['input', 'textarea', 'script', 'noscript', 'style', 'select', 'option', 'button'].indexOf(node.nodeName.toLowerCase()) >= 0) isVisible = false; | ||||
|  | ||||
| 			if (!isVisible) { | ||||
| 				node.classList.add('joplin-clipper-hidden'); | ||||
| 			} else { | ||||
| 				hardcodeDisplayStyles(node); | ||||
| 			} | ||||
| 		} | ||||
| 	} | ||||
|  | ||||
| 	// This sets the PRE elements computed style to the style attribute, so that | ||||
| 	// the info can be exported and later processed by the htmlToMd converter | ||||
| 	// to detect code blocks. | ||||
| @@ -196,6 +218,9 @@ | ||||
| 		} else if (command.name === "completePageHtml") { | ||||
|  | ||||
| 			hardcodePreStyles(document); | ||||
| 			hardcodeDisplayStyles(document); | ||||
| 			// Because cleanUpElement is going to modify the DOM and remove elements we don't want to work | ||||
| 			// directly on the document, so we make a copy of it first. | ||||
| 			const cleanDocument = document.body.cloneNode(true); | ||||
| 			const imageSizes = getImageSizes(document, true); | ||||
| 			cleanUpElement(cleanDocument, imageSizes); | ||||
|   | ||||
| @@ -506,7 +506,7 @@ class Api { | ||||
|  | ||||
| 				// If we could not find the file extension from the URL, try to get it | ||||
| 				// now based on the Content-Type header. | ||||
| 				if (!fileExt) imagePath = this.tryToGuessImageExtFromMimeType_(response, imagePath); | ||||
| 				if (!fileExt) imagePath = await this.tryToGuessImageExtFromMimeType_(response, imagePath); | ||||
| 			} | ||||
| 			return imagePath; | ||||
| 		} catch (error) { | ||||
|   | ||||
		Reference in New Issue
	
	Block a user