I am converting a single page front-end website to desktop application using tauri toolchain. When I download an image or any other file in the application, it displays a download progress bar in the top right corner. I have to disable the progress bar. When I searched how to disable it in this webview2 documentation, it suggested that I can set the CoreWebView2DownloadStartingEventArgs.Handled property to true which will hide the download progress dialog. But I can't find how to set that property in my tauri application source code. I have included my project directory and the all the codes that I have included so far. It will be helpful for me if someone could explain how to set that property to true so that I can hide how to hide the progress bar in my application.
Project Folder: https://drive.google.com/drive/folders/1rT_uaH6Ki_B2Hpud0SsI9ZUNZMZpmUWD?usp=sharing
HTML File:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<img src="https://cdn.pixabay.com/photo/2014/02/27/16/10/flowers-276014_960_720.jpg" alt="W3Schools" width="500">
<a href="https://cdn.pixabay.com/photo/2014/02/27/16/10/flowers-276014_960_720.jpg" download="image.jpg">
<button type="button">Download</button>
</a>
</body>
</html>
RUST main file:
#![cfg_attr(
all(not(debug_assertions), target_os = "windows"),
windows_subsystem = "windows"
)]
fn main() {
tauri::Builder::default()
.run(tauri::generate_context!())
.expect("error while running tauri application");
}
tauri.conf configuration file:
{
"build": {
"beforeBuildCommand": "",
"beforeDevCommand": "",
"devPath": "../assets",
"distDir": "../assets"
},
"package": {
"productName": "test",
"version": "0.1.0"
},
"tauri": {
"allowlist": {
"all": true
},
"bundle": {
"active": true,
"category": "DeveloperTool",
"copyright": "",
"deb": {
"depends": []
},
"externalBin": [],
"icon": [
"icons/32x32.png",
"icons/128x128.png",
"icons/128x128#2x.png",
"icons/icon.icns",
"icons/icon.ico"
],
"identifier": "com.tauri.dev",
"longDescription": "",
"macOS": {
"entitlements": null,
"exceptionDomain": "",
"frameworks": [],
"providerShortName": null,
"signingIdentity": null
},
"resources": [],
"shortDescription": "",
"targets": "all",
"windows": {
"certificateThumbprint": null,
"digestAlgorithm": "sha256",
"timestampUrl": ""
}
},
"security": {
"csp": null
},
"updater": {
"active": false
},
"windows": [
{
"fullscreen": false,
"height": 600,
"resizable": true,
"title": "Test",
"width": 800
}
]
}
}
Got my answer here
I added the following dependencies to my Cargo.toml file
webview2-com = "0.19"
windows = "0.39"
Then in my main.rs, I added a setup hook to the Builder with the following content
#![cfg_attr(
all(not(debug_assertions), target_os = "windows"),
windows_subsystem = "windows"
)]
use tauri::Manager;
use webview2_com::{
DownloadStartingEventHandler, Microsoft::Web::WebView2::Win32::ICoreWebView2_4,
};
use windows::{core::Interface, Win32::System::WinRT::EventRegistrationToken};
fn main() {
tauri::Builder::default()
.setup(|app| {
let window = app.get_window("main").unwrap();
#[cfg(windows)]
window.with_webview(|webview| unsafe {
let mut _token = EventRegistrationToken::default();
let core = webview
.controller()
.CoreWebView2()
.unwrap()
.cast::<ICoreWebView2_4>()
.unwrap();
let handler =
DownloadStartingEventHandler::create(Box::new(move |_, args| {
if let Some(args) = args {
// i don't know how safe that unwrap is, so you may wanna handle errors
// or just ignore them with `let _ = args.SetHandled(true);`
args.SetHandled(true).unwrap();
}
Ok(())
}));
let _ = core.add_DownloadStarting(&handler, &mut _token);
});
Ok(())
})
.run(tauri::generate_context!())
.expect("error while running tauri application");
}
Related
I have followed the microsoft documentation.
From it, I understand that "I can run my own custom HTML/JavaScript code" and make it display on teams with Task Module.
I have done everything recommended my card is showing blank each time invoke the task module.
I'm using the BotBuilder-Sample Node JS SDK
teamsTaskModuleBot.js file contains
// Copyright (c) Microsoft Corporation. All rights reserved.
// Licensed under the MIT License.
const {
TeamsActivityHandler,
MessageFactory,
CardFactory,
} = require("botbuilder");
class TeamsTaskModuleBot extends TeamsActivityHandler
{
constructor ()
{
super();
// See https://aka.ms/about-bot-activity-message to learn more about the message and other activity types.
this.onMessage(async (context,next) =>
{
const card = this.getHeroCardMenu();
const message = MessageFactory.attachment(card);
await context.sendActivity(message);
// By calling next() you ensure that the next BotHandler is run.
await next();
});
this.onMembersAdded(async (context,next) =>
{
const card = this.getHeroCardMenu();
const message = MessageFactory.attachment(card);
await context.sendActivity(message);
// By calling next() you ensure that the next BotHandler is run.
await next();
});
}
getHeroCardMenu ()
{
return CardFactory.heroCard(
"Task Module Invocation from Hero Card",
null, // No images
[
{
type: "invoke",
title: "Open",
value: {type: "task/fetch"},
},
]
);
}
handleTeamsTaskModuleFetch (context,taskModuleRequest)
{
// taskModuleRequest.data can be checked to determine different paths.
return {
task: {
type: "continue",
value: {
url: "https://botiframe.netlify.app/index.html",
height: "medium",
width: "medium",
title: "Task Module Bot",
fallbackUrl: "https://botiframe.netlify.app/index.html"
},
},
};
}
}
module.exports.TeamsTaskModuleBot = TeamsTaskModuleBot;
My manifest.json file
{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.5/MicrosoftTeams.schema.json",
"manifestVersion": "1.5",
"version": "1.0.0",
"id": "208a91ef-baa9-460d-bf8d-7c7bc2f475e0",
"packageName": "com.dipolediamond.taskmodule",
"developer": {
"name": "dipoleDiamond Ltd",
"websiteUrl": "https://www.dipolediamond.com",
"privacyUrl": "https://www.dipolediamond.com/blog",
"termsOfUseUrl": "https://www.dipolediamond.com/contact"
},
"icons": {
"color": "icon-color.png",
"outline": "icon-outline.png"
},
"name": {
"short": "Task Module Bot",
"full": "Simple Task Module Bot"
},
"description": {
"short": "Test Task Module Sample Bot",
"full": "Simple Task Module Sample Bot"
},
"accentColor": "#FFFFFF",
"bots": [
{
"botId": "208a91ef-baa9-460d-xxxx-xxxxxxx",
"scopes": ["personal", "team", "groupchat"],
"supportsFiles": false,
"isNotificationOnly": false
}
],
"permissions": ["identity", "messageTeamMembers"],
"composeExtensions": [
{
"botId": "208a91ef-baa9-460d-xxxx-xxxx",
"canUpdateConfiguration": true,
"commands": [],
"messageHandlers": [
{
"type": "link",
"value": {
"domains":"www.botiframe.netlify.app"
]
}
}
]
}
],
"validDomains": ["www.botiframe.netlify.app"]
}
Before showing your web content, Teams does some basic validation of the end address. This requires, as you've done, that the domain be registed with validDomains and domains sections. However, when I visit the site, I'm getting a certificate error, so it's likely that Teams is blocking your site for that reason. Are you able to get that resolved (custom domain, or cert matching domain (the cert is for *.netlify.com, but your site is running on netlify.app)? Try that first.
I have started developing an addon which would work on package.json of a Github repo. On loading the addon, it requires an additional page refresh for the addon to take effect instead of applying the border as soon as the url is recognized.
manifest.json
{
"manifest_version": 2,
"name": "Border It",
"version": "0.0.1",
"permissions": ["activeTab", "tabs", "https://github.com/*"],
"content_scripts": [
{
"matches": ["https://github.com/*/package.json"],
"js": ["src/scripts/borderify.js"],
}
]
}
borderify.js
document.body.style.border = '5px solid red';
What am I doing wrong?
GitHub updates page content dynamically, so you need to run your script on every GitHub pages ("matches": ["https://github.com/*"]) and observe the location change. Here is more hints:
Event when window.location.href changes
(updated)
Example implementation based on MutationObserver:
{
"manifest_version": 2,
"name": "Border It",
"version": "0.0.1",
"permissions": [
"activeTab",
"tabs",
"https://github.com/*"
],
"content_scripts": [
{
"matches": ["https://github.com/*"],
"js": ["borderify.js"]
}
]
}
function onLocationChanged() {
if (/\/package.json([?#]|$)/.test(location.pathname))
document.body.style.border = '5px solid red';
else
document.body.style.border = '';
}
onLocationChanged(); // executed when the page is initially loaded
let lastUrl;
const observer = new MutationObserver(mutations => {
// executed on any dynamic change in the page
if (location.href == lastUrl)
return;
lastUrl = location.href;
onLocationChanged();
});
const config = {
childList: true,
subtree: true
};
observer.observe(document.body, config);
i'm building a connector for MS Teams and Outlook. I have registered the connector on Connectors Developer Dashboard but when I sideload it on outlook and I try to configure the connector... Nothing happens in my setup page. Indeed,
microsoftTeams.settings.getSettings is not working.
Does the microsoftTeams js library works for Outlook too? If not how do I do?
It seems that Connect To Office 365 Button aren't the ongoing way to do it.
Documentation with dead links and mix between Teams & Outlook doesn't help :(
Thank you!
Edit 1:
AngularJS code called on my configuration page:
$scope.setValidateState = function() {
microsoftTeams.settings.setValidityState(true);
};
$scope.authenticate = function() {
microsoftTeams.authentication.authenticate({
url: isSettings.serverUrl + '/microsoft/auth-start/',
with: 500,
height: 800,
successCallback: function(data) {
$scope.isAuthenticated = data && data['accessToken'];
localStorage.setItem("microsoft-oauth", JSON.stringify(data));
displayConfiguration();
},
failureCallback: function(reason) {
console.log(reason);
}
});
};
function displayConfiguration() {
microsoftTeams.settings.setValidityState(true);
microsoftTeams.settings.registerOnSaveHandler(function(saveEvent) {
microsoftTeams.settings.setSettings({
entityId: 'icescrum-connector-pkey-' + $scope.settings.project.pkey,
contentUrl: isSettings.serverUrl + '/microsoft/setup/',
configName: $scope.settings.project.name
});
microsoftTeams.settings.getSettings(function(settings) {
$scope.settings.webhookUrl = settings.webhookUrl;
console.log(settings.webhookUrl);
saveEvent.notifySuccess();
});
});
microsoftTeams.settings.getSettings(function(settings) {
$scope.setup = !settings.configName;
ProjectService.listByUserAndRole(Session.user.id, 'productOwner', {light: true}).then(function(projects) {
$scope.projects = projects;
if (settings.entityId) {
$scope.settings.project = _.find($scope.projects, {pkey: settings.entityId.split('icescrum-connector-pkey-')[1]});
}
$scope.ready = true;
});
});
}
// Init
$scope.settings = {};
$scope.projects = [];
$scope.ready = false;
var tokenData = JSON.parse(localStorage.getItem("microsoft-oauth"));
$scope.isAuthenticated = tokenData && tokenData['accessToken'];
microsoftTeams.initialize();
if($scope.isAuthenticated){
displayConfiguration();
}
My manifest.json:
{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.3/MicrosoftTeams.schema.json",
"manifestVersion": "1.3",
"id": "a15dcb92-35af-400e-ab9b-99efda40138f",
"version": "1.0.0",
"packageName": "com.iceScrum2",
"developer": {
"name": "Developer",
"websiteUrl": "https://www.icescrum.com",
"privacyUrl": "https://www.icescrum.com",
"termsOfUseUrl": "https://www.icescrum.com"
},
"description": {
"full": "iceScrum connector",
"short": "integration iceScrum with Microsoft Teams with a bot, a connector and a tab"
},
"icons": {
"outline": "icescrum-icon-32x32.png",
"color": "icescrum-icon-192x192.png"
},
"connectors": [
{
"connectorId": "a15dcb92-35af-400e-ab9b-99efda40138f",
"scopes": [
"team"
],
"configurationUrl": "https://icescrum.ngrok.io/icescrum/microsoft/setup/"
}
],
"name": {
"full": "iceScrum2",
"short": "iceScrum2"
},
"accentColor": "#FFFFFF",
"validDomains": [
"*.icescrum.com",
"icescrum.ngrok.io"
]
}
My microsoft Teams js lib was outdated (1.3.4). With the last version (1.4.1) it works well on Outlook and on Teams.
I need to run a content script attached to a specific HTML page that appears when an error occurs. The webextension is an embedded extension at the moment. The files structure is as follows:
- SDK extension [directory]
- webextension [directory]
- main.js
- data [directory]
- error.html
- error-script.js
Everything runs well except that when I click on the button which should fire the content script, nothing happens. I tried several format for the content script file path in the manifest.js "js": ["webextension/data/error-script.js"] but nothing changed.
EDIT:
The path for the error.html when an error occurs contains some automatically generated prefix which does not reflect the actual path:
moz-extension://7c92a8c2-219d-4233-a973-c51032e2a375/data/error.html
Here is a simple example code:
1) manifest.json:
{
"manifest_version": 2,
"name": "example",
"version": "1.0",
"description": "No description.",
"background": {
"scripts": ["main.js","error.js"]
},
"content_scripts": [
{
"matches": ["*://*/error.html"],
"js": ["webextension/data/error-script.js"]
}
],
"permissions": [
"<all_urls>",
"activeTab",
"tabs",
"storage",
"webRequest"
],
"browser_action": {
"default_icon": {
"64": "icons/myicon.png"
},
"default_title": "example"
},
"hasEmbeddedWebExtension": true
}
2) HTML page error.html:
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
Test.
<input type="button" class="error-button" id="error-button" value="error">
</body>
</html>
3) A content script error-script.js:
var button = document.getElementById("error-button");
button.addEventListener("click",showAlert);
function showAlert()
{
alert("Error");
}//end function.
4) A background script: error.js:
var target = "<all_urls>";
function logError(responseDetails) {
errorTab=responseDetails.tabId;
console.log("response tab: "+errorTab);
browser.tabs.update(errorTab,{url: "data/error.html"});
}//end function
browser.webRequest.onErrorOccurred.addListener(
logError,
{urls: [target],
types: ["main_frame"]}
);
I have a firefox webextension ported from chrome extension. The executeScript call fails on this site.
https://addons.mozilla.org/en-US/firefox/
I tested with multiple pages on this site and all are giving the same error
The bare-minimum code to reproduce this is
popup.js
document.addEventListener("DOMContentLoaded", function () {
chrome.tabs.query({"active": true}, function(tabs) {
chrome.tabs.executeScript(tabs[0].id, {"code": "console.log('Script executed in ' + document.location.href);"}, function(r) {
if(chrome.runtime.lastError) {
console.log(chrome.runtime.lastError);
document.body.innerHTML = 'Execute script Fail. check console';
} else {
document.body.innerHTML = 'Execute script Success';
}
});
});
});
manifest.json
{
"manifest_version": 2,
"name": "execscript_test",
"short_name": "execscript_test",
"version": "0.0.1",
"description": "desc",
"icons": {
"19": "images/icon19.png",
"38": "images/icon38.png",
"128": "images/icon.png"
},
"applications": {
"gecko": {
"id": "execscript_test#me.com",
"strict_min_version": "48.0"
}
},
"background": {
"scripts": ["background.js"]
},
"permissions": [
"tabs",
"<all_urls>"
],
"browser_action": {
"browser_style": false,
"default_icon": "images/icon.png",
"default_title": "execscript_test",
"default_popup": "popup.html"
}
}
background.js - file is present but it is empty
popup.html
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<script src="popup.js"></script>
</head>
<body>
</body>
</html>
On https://addons.mozilla.org/en-US/firefox/addon/engrip-tracker/?src=search page I clicked on the browser button and got this error in browser console
Error: No window matching {"matchesHost":["<all_urls>"]}
Stack trace:
Async*#moz-extension://062a83b0-81f1-42f0-84a8-89ecdc2c08e0/popup.js:8:4
Async*#moz-extension://062a83b0-81f1-42f0-84a8-89ecdc2c08e0/popup.js:2:2
EventListener.handleEvent*#moz-extension://062a83b0-81f1-42f0-84a8-89ecdc2c08e0/popup.js:1:1
I thought it could be some url scheme issue but this happens even on https://addons.mozilla.org/en-US/firefox/
The same code works without error on chrome.
I am on FF v50. I tested this on FF nightly also (v53.0a1) and the error persists.
Is this something specific to this site? Or am I missing something here?
This is deliberate, it is covered in e.g. https://bugzilla.mozilla.org/show_bug.cgi?id=1310082