Media3P: GIFs Tab not working

Bug Description

Something I noticed during yesterday’s demo call and am still experiencing today: the GIF tab does not work.

There’s some error loading the GIFs and unfortunately the error message is swallowed.

I suspect there’s some error in getGifResourceFromMedia3p / getResourceFromMedia3p or similar, because the HTTP request is working just fine.

Expected Behaviour

The GIF tab should work just fine

Steps to Reproduce

1. Open editor
2. Go to third-party media tab
3. Go to GIFs tab
4. See error snackbar message

Screenshots

Additional Context

• Plugin Version: 1.24.0-alpha
• WordPress Version: 6.0.1
• Operating System: macOS
• Browser: Chrome

[timarney]

Seems the only way I can re-create now is

• “fresh load of the page”
• visit tab
• scroll to down — at some point the error happens

---

Tracked it back to

const webmSizes = sortMediaBySize(
    m,
    m.videoUrls.filter(({ mimeType }) => mimeType === 'image/webm')
  );
 

Which passes an empty array to

sortMediaBySize

Which calls getOriginalSize with the empty array

const originalSize = getOriginalSize(sortedUrls);

Which tries to pull the width and height off an empty array

function getOriginalSize(mediaUrls) {
  return {
    originalWidth: mediaUrls[0].width,
    originalHeight: mediaUrls[0].height,
  };
}

Which throws the error …

[swissspidy]

Created #12092 for what I had in mind here regarding using the webm versions.