Merge pull request #463 from seyfeb/issue/462

Prevent img loaded event being handled twice

CHANGELOG.md

@@ -102,6 +102,8 @@
   [#447](https://github.com/nextcloud/cookbook/pull/447) @christianlupus
 - Recipe-editing Vue components are not tightly coupled anymore
   [#386](https://github.com/nextcloud/cookbook/pull/386/) @seyfeb
+- Fixed trying to remove already removed img DOM nodes in image lazyloading, fixes #462
+  [#463](https://github.com/nextcloud/cookbook/pull/463/) @seyfeb
 
 ### Removed
 - Travis build system

src/components/LazyPicture.vue

@@ -87,11 +87,14 @@ export default {
 
                 // callback for fully-loaded image event
                 const onThumbnailFullyLoaded = () => {
+                    img.removeEventListener('load', onThumbnailFullyLoaded)
                     el.removeChild(imgPlaceholder)
                     $this.isLoading = false
                 }
+
                 // callback for preview-image-loaded event
                 const onThumbnailPreviewLoaded = () => {
+                    imgPlaceholder.removeEventListener('load', onThumbnailPreviewLoaded)
                     img.addEventListener('load', onThumbnailFullyLoaded)
                     $this.$once('hook:destroyed', () => {
                         img.removeEventListener('load', onThumbnailFullyLoaded)