How to make native video player full width?

It's simple with Wordpress 5

Just add the following CSS:

.wp-video { width: 100% !important }
.wp-video video { width: 100% !important; height: 100% !important; }

I know this comes a bit late but I going to leave here in case some one needs a different alternative from the above answer.

We add the function below to our theme most probably under functions.php or any other included file. The function below wraps the oembed inside the video-container div and below function is the respective CSS for the new class

/**
* Add Response code to video embeds in WordPress
*
*/
function ns_embed_html( $html ) {

  return '<div class="video-container">' . $html . '</div>';
}
add_filter( 'embed_oembed_html', 'ns_embed_html', 10, 3 );
add_filter( 'video_embed_html', 'ns_embed_html' ); // Jetpack

// CSS 
.video-container {
   position: relative;
   padding-bottom: 56.25%;
   height: 0;
   overflow: hidden;
   max-width: 1200px;
   margin: 0 auto;
 }

 .video-container iframe, .video-container object, .video-container embed, .video-container video {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   width: 100%;
   height: 100%;
 }

I added this to my style.css and now the video player is fully responsive!

.wp-video, video.wp-video-shortcode, .mejs-container, .mejs-overlay.load {
    width: 100% !important;
    height: 100% !important;
}
.mejs-container {
    padding-top: 56.25%;
}
.wp-video, video.wp-video-shortcode {
    max-width: 100% !important;
}
video.wp-video-shortcode {
    position: relative;
}
.mejs-mediaelement {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.mejs-controls {
    display: none;
}
.mejs-overlay-play {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: auto !important;
    height: auto !important;
}