High Level Problem
There is no deselect all for 'Other Calendars' in google calendars. We have many employees at my company and I'm constantly adding and removing users when scheduling meetings. I realize there's a 'Find time' feature but aside from that argument I'd like to get this working because I find it interesting.
Solution
Create a page action chrome extension which appears when a tab is on the Google Calendar site. Clicking the page action icon should automate deselecting all calendars by simulating mousedown events.
Implementation
Page action functions correctly with the exception of actually deselecting the calendars.
I used Google Developer tools to see which events fire when I deselect manually and also to see which elements register a handler. The key pair seems to be the document element and the mousedown event. As such I wanted to automate dispatching an event to duplicate the behavior. I did at first dispatch directly on the div assuming it would bubble but when it didn't work and I saw the only event listeners were on the document I tried to raise the event directly there.
In contentscript.js the following method executes when the page action is clicked:
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
// Get the div containing other calendars
var otherCalendars = document.getElementById("calendars_fav");
// Get all divs representing a single selected calendar
var selectedOtherCalendars = otherCalendars.getElementsByClassName("calListLabel-sel");
for (var i=0 ; i < selectedOtherCalendars.length; i++) {
// Get the span which contains the name of the calendar e.g. Contact's birthdays
var c = selectedOtherCalendars[i].children[1];
var name = c.innerHTML;
// Find the location of this element relative to the document
var x = getOffsetLeft(c) + (c.offsetWidth / 2);
var y = getOffsetTop(c) + (c.offsetHeight / 2);
console.log('mousedown on document targeting ' + name + ' x:' + x + ', y:' + y);
// See http://goo.gl/WtlWpv
simulate(document, "mousedown", { pointerX: x, pointerY: y });
}
});
SO: How to simulate mouse click using Javascript? - I lifted the simulate implementation from here
Issue
Logs seem correct and there are no errors but nothing happens and the simulation seems to fail.
- No event appears in the Chrome Developer Tools timeline when I dispatch the event programmatically
- No Google Calendar javascript is executed as a result of the dispatch
Sample log entry:
mousedown on body targeting Ipswich Town x:85.5, y:494
Title Clarification
I don't know if dispatchEvent will work on google calendar from elsewhere I have only tried from my chrome extension contentscript.js.
