Can I disable Firefox / Chrome components from an addon / extension? - google-chrome

I already made some addons for Firefox and extensions for Chrome, but now I had a crazy idea and I would like to know if I can disable Firefox / Chrome components from an addon / extension.
When I say disable components, I mean something like (mostly FF examples):
Firefox Hello
Pocket (Firefox has now a default integration with Pocket)
History
Favorites
Other installed extensions
Resources like "Print" and "Developer Tools"
Etc.
I've searched for the whole Firefox Addon Developer Hub and I didn't found if I can do something like that. If you know the answer, how can I do that or why I can't?
You don't need to describe why it's (or isn't) possible and how I can achieve that, but in this case provide useful and interesting links.

From Firefox it is very easy to disable other things.
This for example disables an addon by id:
//this checks to see if AdBlock Plus is enabled
AddonManager.getAddonsByIDs(["{d10d0bf8-f5b5-c8b4-a8b2-2b9879e08c5d}"], function ([aAddon1]) {
console.log(aAddon1);
var isAddonEnabled = aAddon1.isActive;
alert('AdBlock plus enabled = ' + isAddonEnabled)
//for other properties see here: https://developer.mozilla.org/en-US/Add-ons/Add-on_Manager/Addon#Required_properties
});
Components are done a little differently, you would have to use nsICategoryManager, this disables the default pdf reader:
https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsICategoryManager#Remarks
var CONTENT_TYPE = 'application/pdf';
// Update the category manager in case the plugins are already loaded.
let categoryManager = Cc['#mozilla.org/categorymanager;1'];
categoryManager.getService(Ci.nsICategoryManager).deleteCategoryEntry('Gecko-Content-Viewers', CONTENT_TYPE, false);
// Update pref manager to prevent plugins from loading in future
var stringTypes = '';
var types = [];
var PREF_DISABLED_PLUGIN_TYPES = 'plugin.disable_full_page_plugin_for_types';
if (Services.prefs.prefHasUserValue(PREF_DISABLED_PLUGIN_TYPES)) {
stringTypes = Services.prefs.getCharPref(PREF_DISABLED_PLUGIN_TYPES);
}
if (stringTypes !== '') {
types = stringTypes.split(',');
}
if (types.indexOf(CONTENT_TYPE) === -1) {
types.push(CONTENT_TYPE);
}
Services.prefs.setCharPref(PREF_DISABLED_PLUGIN_TYPES, types.join(','));

Related

Are there requirements in the iPhone (iOS 13) settings for HTML5 Speech Synthesis to work?

I've already searched and found a couple of questions about speech synthesis issues on iOS.
Like this one:
JS Speech Synthesis Issue on iOS
I have implemented all the work-arounds I could find and I don't have any error in the console. Still I get no sound while it works fine on Android and desktop. Even the codepen shared in the question above doesn't work but the author claims it should.
So, this question is more about the device / OS itself: is there anything in an iOS device such as the iPhone, that could prevent text to speech to work? (yes, I checked the volume)
My iOS version is 13.4.1
For completeness sake, my code looks like this:
let hasEnabledVoice = false
/**
* Bug in some browser that dont load voices
*/
if (window.speechSynthesis) {
// Preload voices
speechSynthesis.getVoices()
/**
* iOS hack
* https://stackoverflow.com/questions/32193704/js-speech-synthesis-issue-on-ios/62587365#62587365
*/
document.addEventListener('click', () => {
if (hasEnabledVoice) {
return
}
const fakeUtterance = new SpeechSynthesisUtterance('Hello')
fakeUtterance.volume = 0
speechSynthesis.speak(fakeUtterance)
hasEnabledVoice = true
})
}
function speak(sentence) {
if (window.speechSynthesis) {
const utterance = new SpeechSynthesisUtterance(sentence)
utterance.voice = speechSynthesis.getVoices()[0]
utterance.volume = 1
utterance.rate = 0.9
speechSynthesis.speak(utterance)
}
}

Detect if another browser tab is using speechRecognition

Is it possible to tell if another Chrome tab is using webkitSpeechRecognition?
If you try to use webkitSpeechRecognition while another tab is using it, it will throw an error "aborted" without any message. I want to be able to know if webkitSpeechRecognition is open in another tab, and if so, throw a better error that could notify the user.
Unless your customer is on the same website(you could check by logging the ip/browserprint in database and requesting by json) you cannot do that.
Cross domain protection is in effect, and that lets you know zilch about what happens in other tabs or frames.
I am using webkitSpeechRecognition for chrome ( does not work on FF) and I faced same issues like multiple Chrome tabs. Until the browser implement a better error message a temporary solutions that work for me:
You need to detect when a tab is focused or not in Chrome using
Javascript.
Make javascript code like this
isChromium = window.chrome;
if(isChromium)
{
if (window.addEventListener)
{
// bind focus event
window.addEventListener("focus", function (event)
{
console.log("Browser tab focus..");
recognition.stop();// to avoid error
recognition.start();
}, false);
window.addEventListener("blur", function (event)
{
console.log("Browser tab blur..");
recognition.stop();
}, false);
}
}
There's a small workaround for it. You can store the timestamp in a variable upon activating SpeechRecognition and when it exits after a few seconds of inactivity, it will be compared to a timestamp since the SpeechRecognition was activated. Since two tabs are using the API simultaneously, it will exit immediately.
For Chrome, you can use the code below and modify it base on your needs. Firefox doesn't support this yet at the moment.
var transcriptionStartTime;
var timeSinceLastStart;
function configureRecognition(){
var webkitSpeechRecognition = window.webkitSpeechRecognition || window.SpeechRecognition;
if ('webkitSpeechRecognition' in window) {
recognition = new webkitSpeechRecognition();
recognition.continuous = true;
recognition.interimResults = true;
recognition.lang = "en-US";
recognition.onend = function() {
timeSinceLastStart = new Date().getTime() - transcriptionStartTime;
if (timeSinceLastStart < 100) {
alert('Speech recognition failed to start. Please close the tab that is currently using it.');
}
}
}
}
See browser compatibility here: https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition

Does the MessageDialog class for UWP Apps support three buttons on Mobile?

I'm creating a simple program for reading text file on the Windows Phone. I decided to make it a Universal Windows Platform (UWP) App.
In the app, I have a very simple MessageDialog, with three options, Yes, No, Cancel. It works perfectly on the Desktop and in the Simulator. However, when testing with the actual device, the ShowAsync method fails with the message: "Value does not fall in the expected range".
This only happens if there are more than two commands registered in the dialog. Does the MessageDialog class really supports up to three commands - as the documentation suggests - or is this only applying for UWP Apps running on Desktop devices?
At the moment, there is a clear statement in the docs:
The dialog has a command bar that can support up to 3 commands in desktop apps, or 2 commands in mobile apps.
Sad but true: on mobiles, there are two commands only. Need more? Use ContentDialog instead.
It looks like the documentation is missing information about Mobile (and really the API should do a better job here).
For Mobile, if you hit the Back key you get a null return value, so you can do this (not recommended coding pattern, but best I can think of):
async Task Test()
{
const int YES = 1;
const int NO = 2;
const int CANCEL = 3;
var dialog = new MessageDialog("test");
dialog.Commands.Add(new UICommand { Label = "yes", Id = YES });
dialog.Commands.Add(new UICommand { Label = "no", Id = NO });
// Ugly hack; not really how it's supposed to be used.
// TODO: Revisit if MessageDialog API is updated in future release
var deviceFamily = AnalyticsInfo.VersionInfo.DeviceFamily;
if (deviceFamily.Contains("Desktop"))
{
dialog.Commands.Add(new UICommand { Label = "cancel", Id = CANCEL });
}
// Maybe Xbox 'B' button works, but I don't know so best to not do anything
else if (!deviceFamily.Contains("Mobile"))
{
throw new Exception("Don't know how to show dialog for device "
+ deviceFamily);
}
// Will return null if you press Back on Mobile
var result = await dialog.ShowAsync();
// C# 6 syntactic sugar to avoid some null checks
var id = (int)(result?.Id ?? CANCEL);
Debug.WriteLine("You chose {0}", id);
}

How do I detect Chromium specifically vs. Chrome?

Is there a way to detect if a visitor to my site is running Chromium as opposed to Google Chrome? Even basic UA sniffing (which I know is bad practice) would suffice for my particular case, but it appears that Chromium and Chrome share the same UA string – is that correct? Is there any other way that I can differentiate between the two?
Note:
This no longer works, because now all Chrome-based-navigators have all plugins.
New Chromium-versions do have the PDF-plugin, too.
But they also have Chromium-plugins, so if any plugin starts with "Chromium", it's Chromium:
function isChromium() {
for (var i = 0, u = "Chromium", l = u.length; i < navigator.plugins.length; i++) {
if (navigator.plugins[i].name != null && navigator.plugins[i].name.substr(0, l) === u)
return true;
}
return false;
}
Also, use this to identify Microsoft Chredge (aka. Anaheim)
function isEdg() {
for (var i = 0, u = "Microsoft Edg", l = u.length; i < navigator.plugins.length; i++) {
if (navigator.plugins[i].name != null && navigator.plugins[i].name.substr(0, l) === u)
return true;
}
return false;
}
Chrome ships with a built-in PDF reader, Chromium doesn't.
You could detect this by using JavaScript:
function isChrome() { // Actually, isWithChromePDFReader
for (var i=0; i<navigator.plugins.length; i++)
if (navigator.plugins[i].name == 'Chrome PDF Viewer') return true;
return false;
}
This method is not 100% reliable, because users can copy the PDF reader binary from Chrome to their Chromium directory, see this answer on Ask Ubuntu.
There's almost no difference between Chromium and Chrome (certainly not in the rendering or JavaScript engine), so why do you want to spot the difference?
Starting with Chromium 84 there's a new method called User-Agent Client Hints reference
You can check if the userAgentData property exists and look for brand data. It will return an array that looks something like this.
[{
"brand": " Not;A Brand",
"version": "99"
}, {
"brand": "Google Chrome",
"version": "91"
}, {
"brand": "Chromium",
"version": "91"
}]
userAgentData.brands will contain varying values in a varying order, so don't rely on something appearing at a certain index. Instead check if the property exists in the array.
if (navigator.userAgentData) {
let vendors = window.navigator.userAgentData.brands;
if (vendors.filter(e => e.brand === 'Google Chrome').length > 0) {
console.log('Chrome')
} else {
console.log('Chromium')
}
}
Here is a variation to Paul W.'s answer that works for Chromium version 42 and above:
function isChromium() { // Actually, isWithChromiumPDFReader
for (var i=0; i<navigator.plugins.length; i++)
if (navigator.plugins[i].name == 'Chromium PDF Viewer') return true;
return false;
}
This of course only works if the plugin has not been disabled by the user.
Here is another way, using SpeechSynthesis feature.
Google Chrome Browser ships TTS voices, where Chromium browsers (incl. Brave) do not. Voices can be installed manually, with espeak (on linux) however the Google voices all start with Google, where the manually installed voices do not. As far as I know the Chrome voices are propriety, not free.
The collection of voices is an Array where each voices looks like this:
{
voiceURI: "Google Deutsch",
name: "Google Deutsch",
lang: "de-DE",
localService: false,
default: true
}
We just need to find one who's name/URI starts with Google ...
function hasGoogleVoices() {
return window.speechSynthesis.getVoices()
.some(v => /^google/i.test(v.name));
}
(Tested on Linux for Chrome, Brave, Chromium and Firefox)
Please can someone check Safari and Windows. Thx.
Could not comment on https://stackoverflow.com/a/68428992/14238203 Josh Answer.
On latest Chrome and Chromium (Oct 2021) some of the solutions returns true for both, so I had to find a different solution.
I took https://stackoverflow.com/a/63724166/14238203 fliptopbox code and implmented Josh answer.
const isChrome = navigator.userAgentData.brands.some((v) => /^google/i.test(v.brand));
The issue with Josh answer is that if you try this when just loading a page, the getVoices() returns empty array until all the voices are loaded (page finished loading)
A promise solution to that here - https://stackoverflow.com/a/59786665/14238203
For my use case it was a bit cumbersome with the getVoices() so I used the user agent hints solution.

IndexedDB not working in FireFox and IE

I have the latest versions of Firefox and IE, but the example in html5rocks.com is not working in these two browsers. I tested with Chrome and it works fine.
I have noted that these browsers does not fire any event ('onsuccess' or 'onerror') on attempting to open the indexedDB as follows.
var request = indexedDB.open("todos");
Please share any ideas/solution for this issue.
to make html5rocks demo work on Firefox you need to attach onupgradeneeded event on database open instead of setversion method for creating the database.
here is the code sample that works both on Firefox and Chrome:
myStorage.indexedDB.open = function() {
var v = 1;
var request = indexedDB.open("todos", v);
//Firefox code for db init
request.onupgradeneeded = function (e) {
myStorage.indexedDB.db = e.target.result;
var db = myStorage.indexedDB.db;
// We can only create Object stores in a setVersion transaction;
if(db.objectStoreNames.contains("todo")) {
var storeReq = db.deleteObjectStore("todo");
}
var store = db.createObjectStore("todo",
{keyPath: "timeStamp"});
}
request.onsuccess = function(e) {
myStorage.indexedDB.db = e.target.result;
var db = myStorage.indexedDB.db;
//Chrome code for db init
if (v!= db.version && db.setVersion) {
var setVrequest = db.setVersion(v);
// onsuccess is the only place we can create Object Stores
setVrequest.onerror = myStorage.indexedDB.onerror;
setVrequest.onsuccess = function(e) {
if(db.objectStoreNames.contains("todo")) {
db.deleteObjectStore("todo");
}
var store = db.createObjectStore("todo",
{keyPath: "timeStamp"});
myStorage.indexedDB.getAllTodoItems();
};
}
else
myStorage.indexedDB.getAllTodoItems();
};
request.onerror = myStorage.indexedDB.onerror;
}
Edit: Here is a link to working version of the html5roks ToDo demo, which I maintain on github, expanded with two new features for viewing details data and updating values.
Chrome is behind on the IndexedDB standard.
There was a new revision introduced in December and Firefox and IE have upgraded. Chrome has not yet.
I believe it's mostly folks from the Chrome crew who run HTML5Rocks.com so it makes sense why these examples would be behind.
The big change between the pre and post-December 2010 API are the change in setVersion requests and the new onupgradeneeded callback.
Todo list example is outdated IndexedDB specification implemented on chrome. Now you got to use onupgardedneeded method, and well setVersion too for now.
IndexedDB is not supported on IE. Visit html5test.com for verification
Edit 2015: IndexedDB API is available in IE as of version 10