Checking on the event the relatedTarget exists before setting its pro…

…perty. fixes videojs#2024

.gitignore

@@ -26,3 +26,5 @@ sandbox/*
 
 test/coverage/*
 .coveralls.yml
+
+.idea/

.jshintrc

@@ -16,13 +16,11 @@
         "_V_",
         "goog",
         "console",
-
         "require",
         "define",
         "module",
         "exports",
         "process",
-
         "q",
         "asyncTest",
         "deepEqual",
@@ -39,6 +37,7 @@
         "stop",
         "strictEqual",
         "test",
-        "sinon"
+        "sinon",
+        "MouseEvent"
     ]
 }

Gruntfile.js

@@ -80,7 +80,7 @@ module.exports = function(grunt) {
       novtt: { src: './build/temp/video.js', dest: './build/temp/alt/video.novtt.js' },
       dist: { expand: true, cwd: 'build/temp/', src: ['**/**'], dest: 'dist/', filter: 'isFile' },
       examples: { expand: true, cwd: 'build/examples/', src: ['**/**'], dest: 'dist/examples/', filter: 'isFile' },
-      cdn: { expand: true, cwd: 'dist/', src: ['**/**'], dest: 'dist/cdn/', filter: 'isFile' },
+      cdn: { expand: true, cwd: 'dist/', src: ['**/**'], dest: 'dist/cdn/', filter: 'isFile' }
     },
     aws_s3: {
       options: {
@@ -281,7 +281,7 @@ module.exports = function(grunt) {
       build: {
         options: {},
         files: {
-          'build/temp/video.js.map': ['build/temp/video.js'],
+          'build/temp/video.js.map': ['build/temp/video.js']
         }
       }
     },
@@ -293,11 +293,11 @@ module.exports = function(grunt) {
     concat: {
       vtt: {
         options: {
-          separator: '\n',
+          separator: '\n'
         },
         src: ['build/temp/video.js', 'node_modules/vtt.js/dist/vtt.js'],
-        dest: 'build/temp/video.js',
-      },
+        dest: 'build/temp/video.js'
+      }
     }
   });
 

src/js/events.js

@@ -52,9 +52,11 @@ var fixEvent = function(event) {
     }
 
     // Handle which other element the event is related to
-    event.relatedTarget = event.fromElement === event.target ?
-      event.toElement :
-      event.fromElement;
+    if(!event.relatedTarget) {
+      event.relatedTarget = event.fromElement === event.target ?
+        event.toElement :
+        event.fromElement;
+    }
 
     // Stop the default browser action
     event.preventDefault = function () {

test/unit/events.js

@@ -1,5 +1,6 @@
 import * as Events from '../../src/js/events.js';
 import document from 'global/document';
+import TestHelpers from './test-helpers.js';
 
 q.module('Events');
 
@@ -201,3 +202,23 @@ test('should have a defaultPrevented property on an event that was prevent from
 
   Events.trigger(el, 'test');
 });
+
+test('should have relatedTarget correctly set on the event', function() {
+  expect(2);
+
+  var el1 = document.createElement('div'),
+      el2 = document.createElement('div'),
+      relatedEl = document.createElement('div');
+
+  Events.on(el1, 'click', function(e){
+    equal(e.relatedTarget, relatedEl, 'relatedTarget is set for all browsers when referring element is set on the event');
+  });
+
+  Events.trigger(el1, TestHelpers.makeMouseEvent('click', relatedEl));
+
+  Events.on(el2, 'click', function(e) {
+    equal(e.relatedTarget, null, 'relatedTarget is null when none is provided');
+  });
+
+  Events.trigger(el2, TestHelpers.makeMouseEvent('click'));
+});

test/unit/test-helpers.js

@@ -25,6 +25,23 @@ var TestHelpers = {
     return player = new Player(videoTag, playerOptions);
   },
 
+  makeMouseEvent: function(type, relatedTarget){
+    var event;
+
+    if(MouseEvent) {
+      return new MouseEvent(type, {relatedTarget: relatedTarget || null});
+    }
+
+    event = document.createEvent('MouseEvents');
+
+    if(event.initMouseEvent) {
+      event.initMouseEvent(type, true, true, window, 0, 0, 0, 80, 20, false, false, false, false, 0, relatedTarget || null);
+    } else {
+      event.initEvent(type, true, false);
+    }
+    return event;
+  },
+
   getComputedStyle: function(el, rule){
     var val;
 
@@ -39,4 +56,4 @@ var TestHelpers = {
   }
 };
 
-export default TestHelpers;
+export default TestHelpers;