Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix mp3 uploads on chrome #7398

Merged
merged 1 commit into from
Jun 21, 2018
Merged

Conversation

jorgefilipecosta
Copy link
Member

Description

Regressed in: #6968

In #6968 we started validating mime types on the client. It seems mime types used by the browsers may not be the expected ones.
For example, chrome has a bug where mp3 files use audio/mp3 instead of audio/mpeg, so this made uploading mp3 files impossible: https://bugs.chromium.org/p/chromium/issues/detail?id=227004.
In this PR we use extensions to compute possible equivalent mime types making the validation more flexible.

How has this been tested?

Verified uploads still work as before.
Verified it is now possible to upload mp3 files on chrome.

@jorgefilipecosta jorgefilipecosta self-assigned this Jun 20, 2018
@jorgefilipecosta jorgefilipecosta added [Type] Bug An existing feature does not function as intended [Feature] Media Anything that impacts the experience of managing media labels Jun 20, 2018
@jorgefilipecosta jorgefilipecosta added this to the 3.1 milestone Jun 20, 2018
@jorgefilipecosta jorgefilipecosta requested a review from a team June 20, 2018 11:33
const [ generalMimeType ] = mime.split( '/' );
const extensions = extensionsString.split( '|' );
return [ mime, ...map( extensions, ( extension ) => `${ generalMimeType }/${ extension }` ) ];
} );
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do you think it's possible to unit test that?

Copy link
Member

@aduth aduth left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Generally looks good and a reasonable change. I'm not entirely sure which upload flow to use for testing this. Uploading mp3 to the media library worked fine for me in Chrome.

Also agree with Riad: This should be a separate, tested function. We should avoid inlining complex logic like this.

@@ -49,8 +49,19 @@ export function mediaUpload( {

// Allowed types for the current WP_User
const allowedMimeTypesForUser = get( window, [ '_wpMediaSettings', 'allowedMimeTypes' ] );
// Browsers may use unexpected mime types and they defer from browser to browser.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Typo: "defer" -> "differ"

// This solves the problem in chrome where mp3 files have audio/mp3 instead of audio/mpeg.
// https://bugs.chromium.org/p/chromium/issues/detail?id=227004
const flexibleAllowedMimeTypes = flatMap( allowedMimeTypesForUser, ( mime, extensionsString ) => {
const [ generalMimeType ] = mime.split( '/' );
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minor: Canonical name for this value is its "type" (the part after slash being its "subtype"):

https://en.wikipedia.org/wiki/Media_type#Naming

@jorgefilipecosta jorgefilipecosta force-pushed the fix/mp3-uploads-on-chrome branch 3 times, most recently from 1292f11 to 47df3ec Compare June 21, 2018 15:07
@jorgefilipecosta jorgefilipecosta force-pushed the fix/mp3-uploads-on-chrome branch from 47df3ec to afca519 Compare June 21, 2018 15:09
@jorgefilipecosta jorgefilipecosta merged commit 07cb2ce into master Jun 21, 2018
@jorgefilipecosta jorgefilipecosta deleted the fix/mp3-uploads-on-chrome branch June 21, 2018 15:25
@jorgefilipecosta
Copy link
Member Author

Thank you for the reviews they were addressed, regarding the testing instruction before this PR was merged It was impossible to upload mp3 in the audio block now it should be possible. I'm not aware and I hope there no other noticeable changes.

* @param {?Object} wpMimeTypesObject Mime type object received from the server.
* Extensions are keys separated by '|' and values are mime types associated with an extension.
*
* @return {?Array} Media Object Promise.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Return description is inaccurate (copy-pasta from createMediaFromFile 🍝 )

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Media Anything that impacts the experience of managing media [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants