Add UrlReferrer in NPS survey AND remove userId references - aka dead code (#523)
This commit is contained in:
tyaginidhi
GitHub
Родитель
a31a93b3f5
Коммит
9fb4e80e28
200
media/main.js
200
media/main.js
|
|
@ -5,122 +5,146 @@
|
|||
|
||||
/* eslint-disable no-undef */
|
||||
|
||||
function renderSurvey(TenantId,UserId, EnvironmentId,Geo,ProductVersion,Culture,DeviceType,FormsProEligibilityId)
|
||||
{
|
||||
function renderSurvey(
|
||||
TenantId,
|
||||
EnvironmentId,
|
||||
Geo,
|
||||
ProductVersion,
|
||||
Culture,
|
||||
DeviceType,
|
||||
UrlReferrer,
|
||||
FormsProEligibilityId
|
||||
) {
|
||||
// eslint-disable-next-line no-undef
|
||||
const se = new window['SurveyEmbed']("v4j5cvGGr0GRqy180BHbRytFqxSnvs1AqKx-mFT6qLBUOE5POUVGTVRDUDI1SEVaOFVaV1RGM0k4VyQlQCN0PWcu",
|
||||
"https://customervoice.microsoft.com/","https://mfpembedcdnmsit.azureedge.net/mfpembedcontmsit","true");
|
||||
const se = new window["SurveyEmbed"](
|
||||
"v4j5cvGGr0GRqy180BHbRytFqxSnvs1AqKx-mFT6qLBUOE5POUVGTVRDUDI1SEVaOFVaV1RGM0k4VyQlQCN0PWcu",
|
||||
"https://customervoice.microsoft.com/",
|
||||
"https://mfpembedcdnmsit.azureedge.net/mfpembedcontmsit",
|
||||
"true"
|
||||
);
|
||||
const context = {
|
||||
TenantId:TenantId,EnvironmentId:EnvironmentId,Geo:Geo,ProductVersion:ProductVersion,Culture:Culture,DeviceType:DeviceType
|
||||
TenantId: TenantId,
|
||||
EnvironmentId: EnvironmentId,
|
||||
Geo: Geo,
|
||||
ProductVersion: ProductVersion,
|
||||
Culture: Culture,
|
||||
DeviceType: DeviceType,
|
||||
UrlReferrer: UrlReferrer,
|
||||
};
|
||||
if (FormsProEligibilityId) {
|
||||
context.FormsProEligibilityId = FormsProEligibilityId;
|
||||
} else {
|
||||
context.UserId = UserId;
|
||||
context.FormsProEligibilityId = FormsProEligibilityId;
|
||||
}
|
||||
se.renderPopup(context);
|
||||
}
|
||||
|
||||
function resizeSurvey() {
|
||||
// eslint-disable-next-line no-undef
|
||||
const embedPopup = document.getElementById('MfpEmbed_Popup');
|
||||
const embedPopup = document.getElementById("MfpEmbed_Popup");
|
||||
if (embedPopup) {
|
||||
// eslint-disable-next-line no-undef
|
||||
if (window.innerHeight <= 600) {
|
||||
embedPopup.style.maxWidth = '80%';
|
||||
embedPopup.style.height = '90%';
|
||||
} else {
|
||||
embedPopup.style.maxWidth = '420px';
|
||||
embedPopup.style.height = '460px';
|
||||
}
|
||||
// eslint-disable-next-line no-undef
|
||||
if (window.innerHeight <= 600) {
|
||||
embedPopup.style.maxWidth = "80%";
|
||||
embedPopup.style.height = "90%";
|
||||
} else {
|
||||
embedPopup.style.maxWidth = "420px";
|
||||
embedPopup.style.height = "460px";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Apply custom styles to modal div and exit button
|
||||
// Apply custom styles to modal div and exit button
|
||||
function applyCustomStyles() {
|
||||
// eslint-disable-next-line no-undef
|
||||
const iconDiv = document.getElementById('mfpembed_iconDiv');
|
||||
const iconDiv = document.getElementById("mfpembed_iconDiv");
|
||||
if (iconDiv) {
|
||||
iconDiv.style.width = '21px';
|
||||
iconDiv.style.height = '21px';
|
||||
iconDiv.style.border = '0px';
|
||||
iconDiv.style.right = '6px';
|
||||
iconDiv.style.top = '6px';
|
||||
iconDiv.style.position = 'absolute';
|
||||
iconDiv.style.marginRight = '0';
|
||||
iconDiv.style.marginTop = '0';
|
||||
iconDiv.style.fontStyle = 'normal';
|
||||
iconDiv.style.borderRadius = '50%';
|
||||
iconDiv.style.borderColor = 'white';
|
||||
iconDiv.style.width = "21px";
|
||||
iconDiv.style.height = "21px";
|
||||
iconDiv.style.border = "0px";
|
||||
iconDiv.style.right = "6px";
|
||||
iconDiv.style.top = "6px";
|
||||
iconDiv.style.position = "absolute";
|
||||
iconDiv.style.marginRight = "0";
|
||||
iconDiv.style.marginTop = "0";
|
||||
iconDiv.style.fontStyle = "normal";
|
||||
iconDiv.style.borderRadius = "50%";
|
||||
iconDiv.style.borderColor = "white";
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
const crossButtonDiv = document.getElementById('MfpEmbed_CrossButton');
|
||||
if (crossButtonDiv) {
|
||||
crossButtonDiv.remove();
|
||||
const cancelSvgDiv = document.createElement("div");
|
||||
cancelSvgDiv.innerHTML = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M14.1016 1.60156L8.20312 7.5L14.1016 13.3984L13.3984 14.1016L7.5 8.20312L1.60156 14.1016L0.898438 13.3984L6.79688 7.5L0.898438 1.60156L1.60156 0.898438L7.5 6.79688L13.3984 0.898438L14.1016 1.60156Z" fill="#323130"/>
|
||||
</svg>`;
|
||||
cancelSvgDiv.style.width = '14px';
|
||||
cancelSvgDiv.style.height = '14px';
|
||||
cancelSvgDiv.style.boxSizing = 'unset';
|
||||
cancelSvgDiv.style.cursor = 'pointer';
|
||||
iconDiv.appendChild(cancelSvgDiv)
|
||||
}
|
||||
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
const iFrame = document.getElementById('MfpEmbed_Popup_Iframe');
|
||||
const crossButtonDiv = document.getElementById("MfpEmbed_CrossButton");
|
||||
if (crossButtonDiv) {
|
||||
crossButtonDiv.remove();
|
||||
const cancelSvgDiv = document.createElement("div");
|
||||
cancelSvgDiv.innerHTML = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M14.1016 1.60156L8.20312 7.5L14.1016 13.3984L13.3984 14.1016L7.5 8.20312L1.60156 14.1016L0.898438 13.3984L6.79688 7.5L0.898438 1.60156L1.60156 0.898438L7.5 6.79688L13.3984 0.898438L14.1016 1.60156Z" fill="#323130"/>
|
||||
</svg>`;
|
||||
cancelSvgDiv.style.width = "14px";
|
||||
cancelSvgDiv.style.height = "14px";
|
||||
cancelSvgDiv.style.boxSizing = "unset";
|
||||
cancelSvgDiv.style.cursor = "pointer";
|
||||
iconDiv.appendChild(cancelSvgDiv);
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
const iFrame = document.getElementById("MfpEmbed_Popup_Iframe");
|
||||
if (iFrame) {
|
||||
iFrame.style.borderRadius = '2px';
|
||||
iFrame.addEventListener('load', () => {
|
||||
iFrame.focus();
|
||||
iFrame.setAttribute('tabindex', '1');
|
||||
});
|
||||
// TODO: Localization
|
||||
if (!iFrame.hasAttribute('title')) {
|
||||
iFrame.setAttribute('title','SurveyTile');
|
||||
}
|
||||
// TODO: Localization
|
||||
if (!iFrame.hasAttribute('aria-label')) {
|
||||
iFrame.setAttribute('aria-label', 'SurveyTile');
|
||||
}
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
const closeButton = document.getElementById('MfpEmbed_CrossButton');
|
||||
// eslint-disable-next-line no-undef
|
||||
const embedPopup = document.getElementById('MfpEmbed_Popup');
|
||||
if (closeButton) {
|
||||
closeButton.setAttribute('tabindex', '1');
|
||||
if (!closeButton.hasAttribute('alt')) {
|
||||
iFrame.style.borderRadius = "2px";
|
||||
iFrame.addEventListener("load", () => {
|
||||
iFrame.focus();
|
||||
iFrame.setAttribute("tabindex", "1");
|
||||
});
|
||||
// TODO: Localization
|
||||
closeButton.setAttribute('alt', 'Close');
|
||||
}
|
||||
closeButton.addEventListener('focusout', () => {
|
||||
embedPopup?.focus();
|
||||
iFrame?.focus();
|
||||
});
|
||||
closeButton.addEventListener('keypress', () => {
|
||||
closeButton.click();
|
||||
});
|
||||
if (!iFrame.hasAttribute("title")) {
|
||||
iFrame.setAttribute("title", "SurveyTile");
|
||||
}
|
||||
// TODO: Localization
|
||||
if (!iFrame.hasAttribute("aria-label")) {
|
||||
iFrame.setAttribute("aria-label", "SurveyTile");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function loadSurvey(){
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
const closeButton = document.getElementById("MfpEmbed_CrossButton");
|
||||
// eslint-disable-next-line no-undef
|
||||
const embedPopup = document.getElementById("MfpEmbed_Popup");
|
||||
if (closeButton) {
|
||||
closeButton.setAttribute("tabindex", "1");
|
||||
if (!closeButton.hasAttribute("alt")) {
|
||||
// TODO: Localization
|
||||
closeButton.setAttribute("alt", "Close");
|
||||
}
|
||||
closeButton.addEventListener("focusout", () => {
|
||||
embedPopup?.focus();
|
||||
iFrame?.focus();
|
||||
});
|
||||
closeButton.addEventListener("keypress", () => {
|
||||
closeButton.click();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function loadSurvey() {
|
||||
const el = document.querySelector("#npsContext");
|
||||
const tenantId = el.dataset.tid;
|
||||
const userId = el.dataset.uid;
|
||||
const urlReferrer = el.dataset.urlReferrer;
|
||||
const envId = el.dataset.envId;
|
||||
const geo = el.dataset.geo;
|
||||
const culture = el.dataset.culture;
|
||||
const productVersion = el.dataset.productVersion;
|
||||
const productVersion = el.dataset.productVersion;
|
||||
const deviceType = el.dataset.deviceType;
|
||||
const formsProEligibilityId = el.dataset.formsProEligibilityId
|
||||
renderSurvey(tenantId,userId,envId,geo,productVersion,culture,deviceType,formsProEligibilityId);
|
||||
const formsProEligibilityId = el.dataset.formsProEligibilityId;
|
||||
renderSurvey(
|
||||
tenantId,
|
||||
envId,
|
||||
geo,
|
||||
productVersion,
|
||||
culture,
|
||||
deviceType,
|
||||
urlReferrer,
|
||||
formsProEligibilityId
|
||||
);
|
||||
resizeSurvey();
|
||||
applyCustomStyles();
|
||||
}
|
||||
}
|
||||
|
||||
loadSurvey();
|
||||
loadSurvey();
|
||||
|
|
|
|||
|
|
@ -3,34 +3,53 @@
|
|||
* Licensed under the MIT License. See License.txt in the project root for license information.
|
||||
*/
|
||||
|
||||
import * as vscode from 'vscode';
|
||||
import WebExtensionContext from '../WebExtensionContext';
|
||||
import * as vscode from "vscode";
|
||||
import WebExtensionContext from "../WebExtensionContext";
|
||||
import { queryParameters } from "../common/constants";
|
||||
import { getDeviceType } from '../utilities/deviceType';
|
||||
import { telemetryEventNames } from '../telemetry/constants';
|
||||
import { getDeviceType } from "../utilities/deviceType";
|
||||
import { telemetryEventNames } from "../telemetry/constants";
|
||||
|
||||
export class NPSWebView {
|
||||
export class NPSWebView {
|
||||
private readonly _webviewPanel: vscode.WebviewPanel;
|
||||
|
||||
private constructor(private readonly extensionUri:vscode.Uri,webViewPanel: vscode.WebviewPanel){
|
||||
private constructor(
|
||||
private readonly extensionUri: vscode.Uri,
|
||||
webViewPanel: vscode.WebviewPanel
|
||||
) {
|
||||
this._webviewPanel = webViewPanel;
|
||||
this._webviewPanel.webview.html = this._getHtml();
|
||||
}
|
||||
|
||||
private _getHtml() {
|
||||
try{
|
||||
const nonce = getNonce();
|
||||
const mainJs = this.extensionResourceUrl('media','main.js');
|
||||
const tid = WebExtensionContext.urlParametersMap?.get(queryParameters.TENANT_ID);
|
||||
const uid = WebExtensionContext.userId;
|
||||
const envId = WebExtensionContext.urlParametersMap?.get(queryParameters.ENV_ID)?.split("/")[4];
|
||||
const geo = WebExtensionContext.urlParametersMap?.get(queryParameters.GEO);
|
||||
const culture = vscode.env.language;
|
||||
const productVersion = process?.env?.BUILD_NAME;
|
||||
const deviceType = getDeviceType();
|
||||
const formsProEligibilityId = WebExtensionContext.formsProEligibilityId;
|
||||
WebExtensionContext.telemetry.sendInfoTelemetry(telemetryEventNames.RENDER_NPS);
|
||||
return `<!DOCTYPE html>
|
||||
try {
|
||||
const nonce = getNonce();
|
||||
const mainJs = this.extensionResourceUrl("media", "main.js");
|
||||
const tid = WebExtensionContext.urlParametersMap?.get(
|
||||
queryParameters.TENANT_ID
|
||||
);
|
||||
const envId = WebExtensionContext.urlParametersMap
|
||||
?.get(queryParameters.ENV_ID)
|
||||
?.split("/")[4];
|
||||
const geo = WebExtensionContext.urlParametersMap?.get(
|
||||
queryParameters.GEO
|
||||
);
|
||||
const culture = vscode.env.language;
|
||||
const productVersion = process?.env?.BUILD_NAME;
|
||||
const deviceType = getDeviceType();
|
||||
const referrerPath: string[] = [
|
||||
"https:/",
|
||||
vscode.env.appHost,
|
||||
"powerplatform/portal",
|
||||
WebExtensionContext.defaultEntityType,
|
||||
WebExtensionContext.defaultEntityId,
|
||||
];
|
||||
const urlReferrer = referrerPath.join("/");
|
||||
const formsProEligibilityId =
|
||||
WebExtensionContext.formsProEligibilityId;
|
||||
WebExtensionContext.telemetry.sendInfoTelemetry(
|
||||
telemetryEventNames.RENDER_NPS
|
||||
);
|
||||
return `<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
|
|
@ -41,42 +60,46 @@ export class NPSWebView {
|
|||
<div id="surveyDiv"></div>
|
||||
<script src="https://mfpembedcdnmsit.azureedge.net/mfpembedcontmsit/Embed.js" type="text/javascript"></script>
|
||||
<link rel="stylesheet" type="text/css" href="https://mfpembedcdnmsit.azureedge.net/mfpembedcontmsit/Embed.css" />
|
||||
<script id="npsContext" data-tid="${tid}" data-uid="${uid}" data-envId="${envId}" data-geo="${geo}" data-deviceType ="${deviceType}" data-culture ="${culture}" data-productVersion ="${productVersion}" data-formsProEligibilityId ="${formsProEligibilityId}" nonce="${nonce}" type="module" src="${mainJs}"></script>
|
||||
<script id="npsContext" data-tid="${tid}" data-urlReferrer="${urlReferrer}" data-envId="${envId}" data-geo="${geo}" data-deviceType ="${deviceType}" data-culture ="${culture}" data-productVersion ="${productVersion}" data-formsProEligibilityId ="${formsProEligibilityId}" nonce="${nonce}" type="module" src="${mainJs}"></script>
|
||||
</body>
|
||||
</html>`;
|
||||
}catch(error){
|
||||
WebExtensionContext.telemetry.sendErrorTelemetry(telemetryEventNames.RENDER_NPS_FAILED, (error as Error)?.message);
|
||||
return '';
|
||||
} catch (error) {
|
||||
WebExtensionContext.telemetry.sendErrorTelemetry(
|
||||
telemetryEventNames.RENDER_NPS_FAILED,
|
||||
(error as Error)?.message
|
||||
);
|
||||
return "";
|
||||
}
|
||||
}
|
||||
|
||||
private extensionResourceUrl(...parts: string[]): vscode.Uri {
|
||||
return this._webviewPanel.webview.asWebviewUri(vscode.Uri.joinPath(this.extensionUri, ...parts));
|
||||
}
|
||||
return this._webviewPanel.webview.asWebviewUri(
|
||||
vscode.Uri.joinPath(this.extensionUri, ...parts)
|
||||
);
|
||||
}
|
||||
|
||||
public static createOrShow(extensionUri: vscode.Uri): NPSWebView {
|
||||
const webview = vscode.window.createWebviewPanel(
|
||||
'testCESSurvey',
|
||||
"testCESSurvey",
|
||||
vscode.l10n.t("Microsoft wants your feeback"),
|
||||
{viewColumn:vscode.ViewColumn.One,
|
||||
preserveFocus:false
|
||||
},
|
||||
{ viewColumn: vscode.ViewColumn.One, preserveFocus: false },
|
||||
{
|
||||
enableScripts:true,
|
||||
enableScripts: true,
|
||||
localResourceRoots: [
|
||||
vscode.Uri.joinPath(extensionUri, 'media','main.js')
|
||||
]
|
||||
vscode.Uri.joinPath(extensionUri, "media", "main.js"),
|
||||
],
|
||||
}
|
||||
);
|
||||
return new NPSWebView(extensionUri, webview);
|
||||
return new NPSWebView(extensionUri, webview);
|
||||
}
|
||||
}
|
||||
|
||||
function getNonce() {
|
||||
let text = '';
|
||||
const possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
|
||||
for (let i = 0; i < 64; i++) {
|
||||
text += possible.charAt(Math.floor(Math.random() * possible.length));
|
||||
}
|
||||
return text;
|
||||
let text = "";
|
||||
const possible =
|
||||
"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
|
||||
for (let i = 0; i < 64; i++) {
|
||||
text += possible.charAt(Math.floor(Math.random() * possible.length));
|
||||
}
|
||||
return text;
|
||||
}
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче