Video.js: ios10 playsinline (with react)

[0xsven]

Description

According to webkit ios 10 allows autoplaying inline videos. To make it work the video element needs the following attributes:

• muted
• autoplay
• playsinline

Also the video needs to be in the viewport.

I cannot figure out how to make videojs add the attribute playsinline to the video element.

Steps to reproduce

My html:

<div data-vjs-player>
    <video playsinline />
</div>

My js:

const options = {
    sources: {type: 'video/mp4', src: '//domain.com/myvideo.mp4'},
    autoplay: true,
    muted: true
}

videojs(videoNode, options)

Results

Expected

I expect videoJs to either have an option like that:
options.playsinline = true

Or to not remove the attribute in <video playsinline />

Actual

Removes the playsinline from the video element:

<video class="vjs-tech" id="vjs_video_3_html5_api" muted="" autoplay="" src="//domain.com/myvideo.mp4"></video>

Additional Information

iOS 10.1.1
Safari
react
videojs 5.17.0

[0xsven]

<video playsinline />

should be

<video playsInline />

thank's react -.-

[0xsven]

For everyone ending up here: I had to apply muted to the react component and not through videojs' options object to make it work:

<div data-vjs-player>
    <video playsInline muted />
</div>

const options = {
    sources: {type: 'video/mp4', src: '//domain.com/myvideo.mp4'},
    autoplay: true
}

videojs(videoNode, options)

This works!

[hartman]

That actually makes a bit of sense to me. Otherwise the video element starts out 'unmuted', and is only retroactively made muted by the JS. That would seem to fail the spirit of the basic premises laid out in: https://webkit.org/blog/6784/new-video-policies-for-ios/