#1872: fix issue with aspect ratio for chrome

ProjectMirador · Feb 21, 2019 · 378965f · 378965f
1 parent 9b98b7e
commit 378965f
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 13 deletions.
diff --git a/__tests__/src/components/CanvasThumbnail.test.js b/__tests__/src/components/CanvasThumbnail.test.js
@@ -16,9 +16,11 @@ describe('CanvasThumbnail', () => {
 
   it('renders properly', () => {
     expect(wrapper.matchesElement(
-      <IntersectionObserver onChange={wrapper.instance().handleIntersection}>
-        <img alt="" />
-      </IntersectionObserver>,
+      <div>
+        <IntersectionObserver onChange={wrapper.instance().handleIntersection}>
+          <img alt="" />
+        </IntersectionObserver>
+      </div>,
     )).toBe(true);
   });
 

diff --git a/src/components/CanvasThumbnail.js b/src/components/CanvasThumbnail.js
@@ -40,16 +40,18 @@ export default class CanvasThumbnail extends Component {
     const { loaded, image } = this.state;
     const imgStyle = { height, width: '100%', ...style };
     return (
-      <IntersectionObserver onChange={this.handleIntersection}>
-        <img
-          alt=""
-          onClick={onClick}
-          onKeyPress={onClick}
-          role="presentation"
-          src={loaded && isValid ? image.src : CanvasThumbnail.defaultImgPlaceholder}
-          style={imgStyle}
-        />
-      </IntersectionObserver>
+      <div>
+        <IntersectionObserver onChange={this.handleIntersection}>
+          <img
+            alt=""
+            onClick={onClick}
+            onKeyPress={onClick}
+            role="presentation"
+            src={loaded && isValid ? image.src : CanvasThumbnail.defaultImgPlaceholder}
+            style={imgStyle}
+          />
+        </IntersectionObserver>
+      </div>
     );
   }
 }