mirror of
https://github.com/laurent22/joplin.git
synced 2024-12-24 10:27:10 +02:00
Clipper: Fixes #1682: Do not clip elements that should be hidden
This commit is contained in:
parent
a6c407b62b
commit
d79089aea3
@ -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) {
|
||||
|
Loading…
Reference in New Issue
Block a user