diff --git a/src/video/video.js b/src/video/video.js
index 962daee..a7b3421 100644
--- a/src/video/video.js
+++ b/src/video/video.js
@@ -31,7 +31,8 @@ export default (
BaseComponent,
mapStateToProps = defaultMapStateToProps,
mapVideoElToProps = defaultMapVideoElToProps,
- mergeProps = defaultMergeProps
+ mergeProps = defaultMergeProps,
+ videoId
) => class Video extends Component {
constructor(props) {
super(props);
@@ -102,7 +103,10 @@ export default (
}
componentDidMount() {
- this.videoEl = this.el.getElementsByTagName('video')[0];
+ const videoEls = this.el.getElementsByTagName('video');
+ this.videoEl = videoId
+ ? videoEls.namedItem(videoId)
+ : videoEls[0];
this.bindEventsToUpdateState();
}
diff --git a/src/video/video.test.js b/src/video/video.test.js
index d0ed24f..1ffa3f3 100644
--- a/src/video/video.test.js
+++ b/src/video/video.test.js
@@ -20,6 +20,12 @@ const TestVideo = ({ video, ...restProps }) => {
+
);
@@ -228,7 +234,20 @@ describe('video', () => {
expect(component.find(TestVideo).prop('duplicateKey')).toBe('mapVideoElToProps');
});
});
-});
-
-
+ describe('when passing in a video id as the fourth argument to the HOC', () => {
+ const videoEl = { id: 'video2' };
+ beforeEach(() => {
+ component = shallow(
+
+ );
+
+ // Emulate videoEl being present
+ // e.g. componentDidMount
+ component.instance().videoEl = videoEl;
+ });
+ it('should find the video by id', () => {
+ expect(videoEl.id).toEqual('video2');
+ });
+ });
+});