Merge pull request #2848 from daiyam/fix-gallery

fix image path due to bad regex

Author: Rokt33r

browser/components/CodeEditor.js

@@ -888,10 +888,7 @@ export default class CodeEditor extends React.Component {
   handlePaste (editor, forceSmartPaste) {
     const { storageKey, noteKey, fetchUrlTitle, enableSmartPaste } = this.props
 
-    const isURL = str => {
-      const matcher = /^(?:\w+:)?\/\/([^\s\.]+\.\S{2}|localhost[\:?\d]*)\S*$/
-      return matcher.test(str)
-    }
+    const isURL = str => /(?:^\w+:|^)\/\/(?:[^\s\.]+\.\S{2}|localhost[\:?\d]*)/.test(str)
 
     const isInLinkTag = editor => {
       const startCursor = editor.getCursor('start')
@@ -964,7 +961,7 @@ export default class CodeEditor extends React.Component {
     } else {
       const image = clipboard.readImage()
       if (!image.isEmpty()) {
-        attachmentManagement.handlePastNativeImage(
+        attachmentManagement.handlePasteNativeImage(
           this,
           storageKey,
           noteKey,
@@ -1109,7 +1106,7 @@ export default class CodeEditor extends React.Component {
             iconv.encodingExists(_charset)
             ? _charset
             : 'utf-8'
-          resolve(iconv.decode(new Buffer(buff), charset).toString())
+          resolve(iconv.decode(Buffer.from(buff), charset).toString())
         } catch (e) {
           reject(e)
         }

browser/main/lib/dataApi/attachmentManagement.js

@@ -227,7 +227,15 @@ function migrateAttachments (markdownContent, storagePath, noteKey) {
  * @returns {String} postprocessed HTML in which all :storage references are mapped to the actual paths.
  */
 function fixLocalURLS (renderedHTML, storagePath) {
-  return renderedHTML.replace(new RegExp('/?' + STORAGE_FOLDER_PLACEHOLDER + '.*?"', 'g'), function (match) {
+  /*
+    A :storage reference is like `:storage/3b6f8bd6-4edd-4b15-96e0-eadc4475b564/f939b2c3.jpg`.
+
+    - `STORAGE_FOLDER_PLACEHOLDER` will match `:storage`
+    - `(?:(?:\\\/|%5C)[-.\\w]+)+` will match `/3b6f8bd6-4edd-4b15-96e0-eadc4475b564/f939b2c3.jpg`
+    - `(?:\\\/|%5C)[-.\\w]+` will either match `/3b6f8bd6-4edd-4b15-96e0-eadc4475b564` or `/f939b2c3.jpg`
+    - `(?:\\\/|%5C)` match the path seperator. `\\\/` for posix systems and `%5C` for windows.
+  */
+  return renderedHTML.replace(new RegExp('/?' + STORAGE_FOLDER_PLACEHOLDER + '(?:(?:\\\/|%5C)[-.\\w]+)+', 'g'), function (match) {
     var encodedPathSeparators = new RegExp(mdurl.encode(path.win32.sep) + '|' + mdurl.encode(path.posix.sep), 'g')
     return match.replace(encodedPathSeparators, path.sep).replace(new RegExp('/?' + STORAGE_FOLDER_PLACEHOLDER, 'g'), 'file:///' + path.join(storagePath, DESTINATION_FOLDER))
   })
@@ -279,7 +287,7 @@ function handleAttachmentDrop (codeEditor, storageKey, noteKey, dropEvent) {
  * @param {String} noteKey Key of the current note
  * @param {DataTransferItem} dataTransferItem Part of the past-event
  */
-function handlePastImageEvent (codeEditor, storageKey, noteKey, dataTransferItem) {
+function handlePasteImageEvent (codeEditor, storageKey, noteKey, dataTransferItem) {
   if (!codeEditor) {
     throw new Error('codeEditor has to be given')
   }
@@ -323,7 +331,7 @@ function handlePastImageEvent (codeEditor, storageKey, noteKey, dataTransferItem
  * @param {String} noteKey Key of the current note
  * @param {NativeImage} image The native image
  */
-function handlePastNativeImage (codeEditor, storageKey, noteKey, image) {
+function handlePasteNativeImage (codeEditor, storageKey, noteKey, image) {
   if (!codeEditor) {
     throw new Error('codeEditor has to be given')
   }
@@ -583,8 +591,8 @@ module.exports = {
   fixLocalURLS,
   generateAttachmentMarkdown,
   handleAttachmentDrop,
-  handlePastImageEvent,
-  handlePastNativeImage,
+  handlePasteImageEvent,
+  handlePasteNativeImage,
   getAttachmentsInMarkdownContent,
   getAbsolutePathsOfAttachmentsInContent,
   removeStorageAndNoteReferences,

tests/dataApi/attachmentManagement.test.js

@@ -128,6 +128,7 @@ it('should test that copyAttachment don\'t uses a random file name if not intend
 
 it('should replace the all ":storage" path with the actual storage path', function () {
   const storageFolder = systemUnderTest.DESTINATION_FOLDER
+  const noteKey = '9c9c4ba3-bc1e-441f-9866-c1e9a806e31c'
   const testInput =
     '<html>\n' +
     '    <head>\n' +
@@ -136,14 +137,18 @@ it('should replace the all ":storage" path with the actual storage path', functi
     '    <body data-theme="default">\n' +
     '        <h2 data-line="0" id="Headline">Headline</h2>\n' +
     '        <p data-line="2">\n' +
-    '            <img src=":storage' + mdurl.encode(path.sep) + '0.6r4zdgc22xp.png" alt="dummyImage.png" >\n' +
+    '            <img src=":storage' + mdurl.encode(path.sep) + noteKey + mdurl.encode(path.sep) + '0.6r4zdgc22xp.png" alt="dummyImage.png" >\n' +
     '        </p>\n' +
     '        <p data-line="4">\n' +
-    '            <a href=":storage' + mdurl.encode(path.sep) + '0.q2i4iw0fyx.pdf">dummyPDF.pdf</a>\n' +
+    '            <a href=":storage' + mdurl.encode(path.sep) + noteKey + mdurl.encode(path.sep) + '0.q2i4iw0fyx.pdf">dummyPDF.pdf</a>\n' +
     '        </p>\n' +
     '        <p data-line="6">\n' +
-    '            <img src=":storage' + mdurl.encode(path.sep) + 'd6c5ee92.jpg" alt="dummyImage2.jpg">\n' +
+    '            <img src=":storage' + mdurl.encode(path.sep) + noteKey + mdurl.encode(path.sep) + 'd6c5ee92.jpg" alt="dummyImage2.jpg">\n' +
     '        </p>\n' +
+    '        <pre class="fence" data-line="8">\n' +
+    '            <span class="filename"></span>\n' +
+    '            <div class="gallery" data-autoplay="undefined" data-height="undefined">:storage' + mdurl.encode(path.sep) + noteKey + mdurl.encode(path.sep) + 'f939b2c3.jpg</div>\n' +
+    '        </pre>\n' +
     '    </body>\n' +
     '</html>'
   const storagePath = '<<dummyStoragePath>>'
@@ -155,14 +160,18 @@ it('should replace the all ":storage" path with the actual storage path', functi
     '    <body data-theme="default">\n' +
     '        <h2 data-line="0" id="Headline">Headline</h2>\n' +
     '        <p data-line="2">\n' +
-    '            <img src="file:///' + storagePath + path.sep + storageFolder + path.sep + '0.6r4zdgc22xp.png" alt="dummyImage.png" >\n' +
+    '            <img src="file:///' + storagePath + path.sep + storageFolder + path.sep + noteKey + path.sep + '0.6r4zdgc22xp.png" alt="dummyImage.png" >\n' +
     '        </p>\n' +
     '        <p data-line="4">\n' +
-    '            <a href="file:///' + storagePath + path.sep + storageFolder + path.sep + '0.q2i4iw0fyx.pdf">dummyPDF.pdf</a>\n' +
+    '            <a href="file:///' + storagePath + path.sep + storageFolder + path.sep + noteKey + path.sep + '0.q2i4iw0fyx.pdf">dummyPDF.pdf</a>\n' +
     '        </p>\n' +
     '        <p data-line="6">\n' +
-    '            <img src="file:///' + storagePath + path.sep + storageFolder + path.sep + 'd6c5ee92.jpg" alt="dummyImage2.jpg">\n' +
+    '            <img src="file:///' + storagePath + path.sep + storageFolder + path.sep + noteKey + path.sep + 'd6c5ee92.jpg" alt="dummyImage2.jpg">\n' +
     '        </p>\n' +
+    '        <pre class="fence" data-line="8">\n' +
+    '            <span class="filename"></span>\n' +
+    '            <div class="gallery" data-autoplay="undefined" data-height="undefined">file:///' + storagePath + path.sep + storageFolder + path.sep + noteKey + path.sep + 'f939b2c3.jpg</div>\n' +
+    '        </pre>\n' +
     '    </body>\n' +
     '</html>'
   const actual = systemUnderTest.fixLocalURLS(testInput, storagePath)