Update content.js

FIXED: Selection from image editors are read as image/png but not blob, causing errors.
kazcfz · Feb 6, 2024 · f753777 · f753777
1 parent 6287f9c
commit f753777
Showing 1 changed file with 31 additions and 23 deletions.
diff --git a/content.js b/content.js
@@ -116,34 +116,42 @@ function handleFileInputClick(event) {
       const imagePreview = overlay.querySelector('#cnp-image-container');
       let noImg = overlay.querySelector('#cnp-not-image');
       navigator.clipboard.read().then(clipboardItems => {
+        console.log(clipboardItems)
         clipboardItems.forEach(clipboardItem => {
           clipboardItem['types'].forEach(clipboardItemType => {
 
             if (clipboardItemType.startsWith('image/')) {
               clipboardItem.getType('image/png').then(blob => {
-                const reader = new FileReader();
-                reader.onload = (event) => {
-                  const img = document.createElement('img');
-                  img.src = event.target.result;
-                  img.id = 'cnp-image-preview';
-
-                  imagePreview.style.cursor = 'pointer';
-                  imagePreview.appendChild(img);
-                  imagePreview.addEventListener('click', () => {
-                    // Convert blob into file object
-                    const file = new File([blob], 'pasted.png', { type: blob.type });
-                    const fileList = new DataTransfer();
-                    fileList.items.add(file);
-                    originalInput.files = fileList.files;
-
-                    triggerChangeEvent(originalInput);
-                    closeOverlay();
-                  });
-                };
-                reader.readAsDataURL(blob);
-                // Remove noImage text since image is found
-                if (noImg)
-                  noImg.parentNode.removeChild(noImg);
+                if (blob) {
+                  const reader = new FileReader();
+                  reader.onload = (event) => {
+                    const img = document.createElement('img');
+                    img.src = event.target.result;
+                    img.id = 'cnp-image-preview';
+
+                    imagePreview.style.cursor = 'pointer';
+                    imagePreview.appendChild(img);
+                    imagePreview.addEventListener('click', () => {
+                      // Convert blob into file object
+                      const file = new File([blob], 'pasted.png', { type: blob.type });
+                      const fileList = new DataTransfer();
+                      fileList.items.add(file);
+                      originalInput.files = fileList.files;
+
+                      triggerChangeEvent(originalInput);
+                      closeOverlay();
+                    });
+                  };
+                  reader.readAsDataURL(blob);
+                  // Remove noImage text since image is found
+                  if (noImg)
+                    noImg.parentNode.removeChild(noImg);
+                } else {
+                  // Check if noImage text exists
+                  if (!noImg)
+                    noImage(imagePreview);
+                  noImg = overlay.querySelector('#cnp-not-image');
+                }
               });
             } else {
               // Check if noImage text exists