Breaking changes
10.0.0 breaking changes
- Deprecates passing config objects to
videoSrc
prop - Deprecates passing config objects to
videoCaptions
prop - Removes
shouldSuppressPlaybackInterruptedErrors
prop
videoSrc
prop
Deprecates passing config objects to The videoSrc
prop still supports URL strings, but no longer accepts config objects or arrays of config objects for video sources. Instead, sources like this must now be defined as <source>
elements.
Migration for a single source config object is fairly straightforward; the src
and type
properties on the config objects map directly to the attributes that need to be set on the <source>
elements:
<HoverVideoPlayer
- videoSrc={{
- src: "path-to/video.mp4",
- type: "video/mp4",
- }}
+ videoSrc={(
+ <source
+ src="path-to/video.mp4"
+ type="video/mp4"
+ />
+ )}
/>
For an array of source config objects, simply wrap your <source>
elements in a fragment:
<HoverVideoPlayer
- videoSrc={[
- {
- src: "video.webm",
- type: "video/webm",
- },
- {
- src: "video.mp4",
- type: "video/mp4",
- },
- ]}
+ videoSrc={(
+ <>
+ <source src="video.webm" type="video/webm" />
+ <source src="video.mp4" type="video/mp4" />
+ </>
+ )}
/>
videoCaptions
prop
Deprecates passing config objects to The videoCaptions
prop also no longer accepts config objects for caption tracks. Instead, caption tracks must be defined as <track>
elements.
Like with the changes to videoSrc
above, all of the properties on the caption track config objects should map directly to attributes on the <track>
elements:
<HoverVideoPlayer
videoSrc="video.mp4"
- videoCaptions={[
- {
- src: "english-captions.vtt",
- srcLang: "en",
- label: "English",
- kind: "captions",
- default: true,
- },
- {
- src: "french-subtitles.vtt",
- srcLang: "fr",
- label: "Francais",
- kind: "subtitles",
- },
- ]}
+ videoCaptions={(
+ <>
+ <track src="english-captions.vtt" srcLang="en" label="English" kind="captions" default />
+ <track src="french-subtitles.vtt" srcLang="fr" label="Francais" kind="subtitles" />
+ </>
+ )}
/>
shouldSuppressPlaybackInterruptedErrors
prop
Removes The shouldSuppressPlaybackInterruptedErrors
prop is being removed, as it is not really needed anymore.
This prop defaulted to true
and was not commonly used, so will likely not impact many people. You can simply remove the prop and things will continue functioning as normal.
<HoverVideoPlayer
videoSrc="video.mp4"
- shouldSuppressPlaybackInterruptedErrors={false}
/>