diff --git a/packages/dom/src/serialize-video.js b/packages/dom/src/serialize-video.js
index a6919666e..80ebfe266 100644
--- a/packages/dom/src/serialize-video.js
+++ b/packages/dom/src/serialize-video.js
@@ -2,7 +2,7 @@
 export function serializeVideos(dom, clone) {
   for (let video of dom.querySelectorAll('video')) {
     // If the video already has a poster image, no work for us to do
-    if (video.getAttribute('poster')) { continue; }
+    if (video.getAttribute('poster')) continue;
 
     let videoId = video.getAttribute('data-percy-element-id');
     let cloneEl = clone.querySelector(`[data-percy-element-id="${videoId}"]`);
diff --git a/packages/dom/test/assets/example.mp4 b/packages/dom/test/assets/example.mp4
deleted file mode 100644
index 32f2a5fa3..000000000
Binary files a/packages/dom/test/assets/example.mp4 and /dev/null differ
diff --git a/packages/dom/test/assets/example.webm b/packages/dom/test/assets/example.webm
new file mode 100644
index 000000000..ec801e8b9
Binary files /dev/null and b/packages/dom/test/assets/example.webm differ
diff --git a/packages/dom/test/serialize-videos.test.js b/packages/dom/test/serialize-videos.test.js
index c4d22ef02..27a3615b0 100644
--- a/packages/dom/test/serialize-videos.test.js
+++ b/packages/dom/test/serialize-videos.test.js
@@ -4,30 +4,34 @@ import serializeDOM from '@percy/dom';
 describe('serializeVideos', () => {
   let $;
 
-  it('serializes video elements', (done) => {
+  it('serializes video elements', async () => {
     withExample(`
-       <video src="base/test/assets/example.mp4" id="video" controls />
+       <video src="base/test/assets/example.webm" id="video" controls />
     `);
 
-    document.querySelector('#video').addEventListener('canplay', () => {
-      $ = parseDOM(serializeDOM());
-
-      expect($('#video')[0].getAttribute('poster').length > 25).toBe(true);
-      done();
+    let $video = window.video;
+    await new Promise(r => {
+      if ($video.readyState > 2) r();
+      else $video.addEventListener('canplay', r);
     });
+
+    $ = parseDOM(serializeDOM());
+    expect($('#video')[0].getAttribute('poster').length > 25).toBe(true);
   });
 
-  it('does not serialize videos with an existing poster', (done) => {
+  it('does not serialize videos with an existing poster', async () => {
     withExample(`
-       <video src="base/test/assets/example.mp4" id="video" poster="//:0" />
+       <video src="base/test/assets/example.webm" id="video" poster="//:0" />
     `);
 
-    document.querySelector('#video').addEventListener('canplay', () => {
-      $ = parseDOM(serializeDOM());
-
-      expect($('#video')[0].getAttribute('poster')).toBe('//:0');
-      done();
+    let $video = window.video;
+    await new Promise(r => {
+      if ($video.readyState > 2) r();
+      else $video.addEventListener('canplay', r);
     });
+
+    $ = parseDOM(serializeDOM());
+    expect($('#video')[0].getAttribute('poster')).toBe('//:0');
   });
 
   it('does not apply blank poster images', () => {