MouseEvent doesn't work in Edge extension

Confirmed Issue #10517903 • Assigned to Bruce L.

Details

Author
Jason G.
Created
Jan 12, 2017
Privacy
This issue is public.
Found in
  • Microsoft Edge
Found in build #
38.14393
Reports
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

The extension’s purpose is to programmatically move the progress slider of Netflix movie using JavaScript. It does move the slider but always to the start of the movie, not the desired point.

manifest.json

{
"name": "Hello World",
"version": "1.0.0",
"description": "Simple Microsoft Edge Extension",
"author": "Hrishikesh Kale",
"icons": {
"16": "icons/icon_16.png",
"32": "icons/icon_32.png",
"48": "icons/icon_48.png",
"128": “icons/icon_128.png”
},
"browser_action": {
"default_icon": {
"20": "icons/icon_20.png",
"25": "icons/icon_25.png",
"30": "icons/icon_30.png",
"40": “icons/icon_40.png”
},
"default_title": “Hello World”
},
"permissions": [
"contextMenus",
"tabs",
"storage",
"activeTab",
“<all_urls>”
],
"minimum_edge_version": "37.14316.1000.0",
"background": {
"scripts": [“js/background.js”],
"persistent": true
}
}

content-script.js

(function () {
//loading jquery lib

// returns an action which delays for some time
var delay = function (milliseconds) {
return function (result) {
return new Promise(function (resolve, reject) {
setTimeout(function () {
resolve(result);
}, milliseconds);
});
};
};

// returns an action which waits until the condition thunk returns true,
// rejecting if maxDelay time is exceeded
var delayUntil = function (condition, maxDelay) {
return function (result) {
var delayStep = 250;
var startTime = (new Date()).getTime();
var checkForCondition = function () {
if (condition()) {
return Promise.resolve(result);
}
if (maxDelay !== null && (new Date()).getTime() - startTime > maxDelay) {
return Promise.reject(Error(‘delayUntil timed out’));
}
return delay(delayStep)().then(checkForCondition);
};
return checkForCondition();
};
};

// add value to the end of array, and remove items from the beginning
// such that the length does not exceed limit
var shove = function (array, value, limit) {
array.push(value);
if (array.length > limit) {
array.splice(0, array.length - limit);
}
};

// compute the mean of an array of numbers
var mean = function (array) {
return array.reduce(function (a, b) { return a + b; }) / array.length;
};

// promise.ensure(fn) method
// note that this method will not swallow errors
Promise.prototype.ensure = function (fn) {
return this.then(fn, function (e) {
fn();
throw e;
});
};

// how many simulated UI events are currently going on
// don’t respond to UI events unless this is 0, otherwise
// we will mistake simulated actions for real ones
var uiEventsHappening = 0;

// video duration in milliseconds
var lastDuration = 60 * 60 * 1000;
var getDuration = function () {
var video = jQuery(‘.player-video-wrapper video’);
if (video.length > 0) {
lastDuration = Math.floor(video[0].duration * 1000);
}
return lastDuration;
};

// current playback position in milliseconds
var getPlaybackPosition = function () {
return Math.floor(jQuery(‘.player-video-wrapper video’)[0].currentTime * 1000);
};

// show the playback controls
var showControls = function () {
uiEventsHappening += 1;
var scrubber = jQuery(‘#scrubber-component’);
var eventOptions = {
'bubbles’: true,
'button’: 0,
'currentTarget’: scrubber[0]
};
scrubber[0].dispatchEvent(new MouseEvent('mousemove’, eventOptions));
return delayUntil(function () {
return scrubber.is(‘:visible’);
}, 1000)().ensure(function () {
uiEventsHappening -= 1;
});
};

// hide the playback controls
var hideControls = function () {
uiEventsHappening += 1;
var player = jQuery(‘#netflix-player’);
var mouseX = 100; // relative to the document
var mouseY = 100; // relative to the document
var eventOptions = {
'bubbles’: true,
'button’: 0,
'screenX’: mouseX - jQuery(window).scrollLeft(),
'screenY’: mouseY - jQuery(window).scrollTop(),
'clientX’: mouseX - jQuery(window).scrollLeft(),
'clientY’: mouseY - jQuery(window).scrollTop(),
'offsetX’: mouseX - player.offset().left,
'offsetY’: mouseY - player.offset().top,
'pageX’: mouseX,
'pageY’: mouseY
};
player[0].dispatchEvent(new MouseEvent('mousemove’, eventOptions));
return delay(1)().ensure(function () {
uiEventsHappening -= 1;
});
};

// jump to a specific time in the video
var seekErrorRecent = [];
var seekErrorMean = 0;
var seek = function (milliseconds) {
uiEventsHappening += 1;
var eventOptions, scrubber, oldPlaybackPosition, newPlaybackPosition;
return showControls().then(function () {
// compute the parameters for the mouse events
scrubber = jQuery(‘#scrubber-component’);
var factor = (milliseconds - seekErrorMean) / getDuration();
factor = Math.min(Math.max(factor, 0), 1);
var mouseX = scrubber.offset().left + Math.round(scrubber.width() * factor); // relative to the document
var mouseY = scrubber.offset().top + scrubber.height() / 2; // relative to the document
eventOptions = {
'bubbles’: true,
'button’: 0,
'screenX’: mouseX - jQuery(window).scrollLeft(),
'screenY’: mouseY - jQuery(window).scrollTop(),
'clientX’: mouseX - jQuery(window).scrollLeft(),
'clientY’: mouseY - jQuery(window).scrollTop(),
'offsetX’: mouseX - scrubber.offset().left,
'offsetY’: mouseY - scrubber.offset().top,
'pageX’: mouseX,
'pageY’: mouseY,
};

    // make the trickplay preview show up
    scrubber[0].dispatchEvent(new MouseEvent('mouseover', eventOptions));
}).then(delayUntil(function () {
    // wait for the trickplay preview to show up
    return jQuery('.trickplay-preview').is(':visible');
}, 2500)).then(function () {
    // remember the old position
    oldPlaybackPosition = getPlaybackPosition();

    // simulate a click on the scrubber
    scrubber[0].dispatchEvent(new MouseEvent('mousedown', eventOptions));
    scrubber[0].dispatchEvent(new MouseEvent('mouseup', eventOptions));
    scrubber[0].dispatchEvent(new MouseEvent('mouseout', eventOptions));
}).then(delayUntil(function () {
    // wait until the seeking is done
    newPlaybackPosition = getPlaybackPosition();
    return Math.abs(newPlaybackPosition - oldPlaybackPosition) >= 1;
}, 5000)).then(function () {
    // compute mean seek error for next time
    var newSeekError = Math.min(Math.max(newPlaybackPosition - milliseconds, -10000), 10000);
    shove(seekErrorRecent, newSeekError, 5);
    seekErrorMean = mean(seekErrorRecent);
}).then(hideControls).ensure(function () {
    uiEventsHappening -= 1;
});

};
return seek(60000);
})();

background.js

browser.browserAction.onClicked.addListener(function(tab) {
browser.tabs.executeScript({
file: “js/content-script.js”
});
});

I attached the complete sample here(https://www.dropbox.com/s/wv3tjb3oow914xf/edge-extension-sample2.zip?dl=0).

Attachments

0 attachments

    Comments and activity

    • Microsoft Edge Team

      Changed Assigned To to “Ibrahim O.”

      Changed Assigned To to “Sermet I.”

      Changed Assigned To from “Sermet I.” to “Scott L.”

      Changed Status to “Confirmed”

      Changed Assigned To from “Scott L.” to “Ted D.”

      Changed Assigned To from “Ted D.” to “Alexander W.”

      Changed Assigned To from “Alexander W.” to “Bruce L.”

    You need to sign in to your Microsoft account to add a comment.

    Sign in