Merge pull request #753 from vector-im/bwindels/rageshake-submit

Allow sending logs to rageshake server
This commit is contained in:
Bruno Windels 2022-06-15 11:28:54 +02:00 committed by GitHub
commit fccc41f4b9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 168 additions and 7 deletions

65
src/domain/rageshake.ts Normal file
View file

@ -0,0 +1,65 @@
/*
Copyright 2022 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import type {BlobHandle} from "../platform/web/dom/BlobHandle";
import type {RequestFunction} from "../platform/types/types";
// see https://github.com/matrix-org/rageshake#readme
type RageshakeData = {
// A textual description of the problem. Included in the details.log.gz file.
text: string | undefined;
// Application user-agent. Included in the details.log.gz file.
userAgent: string;
// Identifier for the application (eg 'riot-web'). Should correspond to a mapping configured in the configuration file for github issue reporting to work.
app: string;
// Application version. Included in the details.log.gz file.
version: string;
// Label to attach to the github issue, and include in the details file.
label: string | undefined;
};
export async function submitLogsToRageshakeServer(data: RageshakeData, logsBlob: BlobHandle, submitUrl: string, request: RequestFunction): Promise<void> {
const formData = new Map<string, string | {name: string, blob: BlobHandle}>();
if (data.text) {
formData.set("text", data.text);
}
formData.set("user_agent", data.userAgent);
formData.set("app", data.app);
formData.set("version", data.version);
if (data.label) {
formData.set("label", data.label);
}
formData.set("file", {name: "logs.json", blob: logsBlob});
const headers: Map<string, string> = new Map();
headers.set("Accept", "application/json");
const result = request(submitUrl, {
method: "POST",
body: formData,
headers
});
let response;
try {
response = await result.response();
} catch (err) {
throw new Error(`Could not submit logs to ${submitUrl}, got error ${err.message}`);
}
const {status, body} = response;
if (status < 200 || status >= 300) {
throw new Error(`Could not submit logs to ${submitUrl}, got status code ${status} with body ${body}`);
}
// we don't bother with reading report_url from the body as the rageshake server doesn't always return it
// and would have to have CORS setup properly for us to be able to read it.
}

View file

@ -16,6 +16,7 @@ limitations under the License.
import {ViewModel} from "../../ViewModel";
import {KeyBackupViewModel} from "./KeyBackupViewModel.js";
import {submitLogsToRageshakeServer} from "../../../domain/rageshake";
class PushNotificationStatus {
constructor() {
@ -51,6 +52,7 @@ export class SettingsViewModel extends ViewModel {
this.maxSentImageSizeLimit = 4000;
this.pushNotifications = new PushNotificationStatus();
this._activeTheme = undefined;
this._logsFeedbackMessage = undefined;
}
get _session() {
@ -152,6 +154,51 @@ export class SettingsViewModel extends ViewModel {
this.platform.saveFileAs(logExport.asBlob(), `hydrogen-logs-${this.platform.clock.now()}.json`);
}
get canSendLogsToServer() {
return !!this.platform.config.bugReportEndpointUrl;
}
get logsServer() {
const {bugReportEndpointUrl} = this.platform.config;
try {
if (bugReportEndpointUrl) {
return new URL(bugReportEndpointUrl).hostname;
}
} catch (e) {}
return "";
}
async sendLogsToServer() {
const {bugReportEndpointUrl} = this.platform.config;
if (bugReportEndpointUrl) {
this._logsFeedbackMessage = this.i18n`Sending logs…`;
this.emitChange();
try {
const logExport = await this.logger.export();
await submitLogsToRageshakeServer(
{
app: "hydrogen",
userAgent: this.platform.description,
version: DEFINE_VERSION,
text: `Submit logs from settings for user ${this._session.userId} on device ${this._session.deviceId}`,
},
logExport.asBlob(),
bugReportEndpointUrl,
this.platform.request
);
this._logsFeedbackMessage = this.i18n`Logs sent succesfully!`;
this.emitChange();
} catch (err) {
this._logsFeedbackMessage = err.message;
this.emitChange();
}
}
}
get logsFeedbackMessage() {
return this._logsFeedbackMessage;
}
async togglePushNotifications() {
this.pushNotifications.updating = true;
this.pushNotifications.enabledOnServer = null;

View file

@ -17,9 +17,12 @@ limitations under the License.
import {BlobHandle} from "../../platform/web/dom/BlobHandle.js";
export type RequestBody = BlobHandle | string | Map<string, string | {blob: BlobHandle, name: string}>;
export type EncodedBody = {
mimeType: string;
body: BlobHandle | string;
// the map gets transformed to a FormData object on the web
body: RequestBody
}
export function encodeQueryParams(queryParams?: object): string {
@ -41,6 +44,11 @@ export function encodeBody(body: BlobHandle | object): EncodedBody {
mimeType: blob.mimeType,
body: blob // will be unwrapped in request fn
};
} else if (body instanceof Map) {
return {
mimeType: "multipart/form-data",
body: body
}
} else if (typeof body === "object") {
const json = JSON.stringify(body);
return {

View file

@ -15,13 +15,13 @@ limitations under the License.
*/
import type {RequestResult} from "../web/dom/request/fetch.js";
import type {EncodedBody} from "../../matrix/net/common";
import type {RequestBody} from "../../matrix/net/common";
import type {ILogItem} from "../../logging/types";
export interface IRequestOptions {
uploadProgress?: (loadedBytes: number) => void;
timeout?: number;
body?: EncodedBody;
body?: RequestBody;
headers?: Map<string, string|number>;
cache?: boolean;
method?: string;

View file

@ -345,6 +345,10 @@ export class Platform {
head.appendChild(styleTag);
}
get description() {
return navigator.userAgent ?? "<unknown>";
}
dispose() {
this._disposables.dispose();
}

View file

@ -4,5 +4,6 @@
"gatewayUrl": "https://matrix.org",
"applicationServerKey": "BC-gpSdVHEXhvHSHS0AzzWrQoukv2BE7KzpoPO_FfPacqOo3l1pdqz7rSgmB04pZCWaHPz7XRe6fjLaC-WPDopM"
},
"defaultHomeServer": "matrix.org"
"defaultHomeServer": "matrix.org",
"bugReportEndpointUrl": "https://element.io/bugreports/submit"
}

View file

@ -27,6 +27,21 @@ export function addCacheBuster(urlStr, random = Math.random) {
return urlStr + `_cacheBuster=${Math.ceil(random() * Number.MAX_SAFE_INTEGER)}`;
}
export function mapAsFormData(map) {
const formData = new FormData();
for (const [name, value] of map) {
let filename;
// Special case {name: string, blob: BlobHandle} to set a filename.
// This is the format returned by platform.openFile
if (value.blob?.nativeBlob && value.name) {
formData.set(name, value.blob.nativeBlob, value.name);
} else {
formData.set(name, value);
}
}
return formData;
}
export function tests() {
return {
"add cache buster": assert => {

View file

@ -20,7 +20,7 @@ import {
ConnectionError
} from "../../../../matrix/error.js";
import {abortOnTimeout} from "../../../../utils/timeout";
import {addCacheBuster} from "./common.js";
import {addCacheBuster, mapAsFormData} from "./common.js";
import {xhrRequest} from "./xhr.js";
class RequestResult {
@ -70,6 +70,9 @@ export function createFetchRequest(createTimeout, serviceWorkerHandler) {
if (body?.nativeBlob) {
body = body.nativeBlob;
}
if (body instanceof Map) {
body = mapAsFormData(body);
}
let options = {method, body};
if (controller) {
options = Object.assign(options, {

View file

@ -18,7 +18,7 @@ import {
AbortError,
ConnectionError
} from "../../../../matrix/error.js";
import {addCacheBuster} from "./common.js";
import {addCacheBuster, mapAsFormData} from "./common.js";
class RequestResult {
constructor(promise, xhr) {
@ -94,6 +94,9 @@ export function xhrRequest(url, options) {
if (body?.nativeBlob) {
body = body.nativeBlob;
}
if (body instanceof Map) {
body = mapAsFormData(body);
}
xhr.send(body || null);
return new RequestResult(promise, xhr);

View file

@ -54,3 +54,11 @@ export function insertAt(parentNode: Element, idx: number, childNode: Node): voi
export function removeChildren(parentNode: Element): void {
parentNode.innerHTML = '';
}
export function disableTargetCallback(callback: (evt: Event) => Promise<void>): (evt: Event) => Promise<void> {
return async (evt: Event) => {
(evt.target as HTMLElement)?.setAttribute("disabled", "disabled");
await callback(evt);
(evt.target as HTMLElement)?.removeAttribute("disabled");
}
}

View file

@ -15,6 +15,7 @@ limitations under the License.
*/
import {TemplateView} from "../../general/TemplateView";
import {disableTargetCallback} from "../../general/utils";
import {KeyBackupSettingsView} from "./KeyBackupSettingsView.js"
export class SettingsView extends TemplateView {
@ -101,11 +102,17 @@ export class SettingsView extends TemplateView {
return row(t, vm.i18n`Use the following theme`, this._themeOptions(t, vm));
}),
);
const logButtons = [];
if (vm.canSendLogsToServer) {
logButtons.push(t.button({onClick: disableTargetCallback(() => vm.sendLogsToServer())}, `Submit logs to ${vm.logsServer}`));
}
logButtons.push(t.button({onClick: () => vm.exportLogs()}, "Download logs"));
settingNodes.push(
t.h3("Application"),
row(t, vm.i18n`Version`, version),
row(t, vm.i18n`Storage usage`, vm => `${vm.storageUsage} / ${vm.storageQuota}`),
row(t, vm.i18n`Debug logs`, t.button({onClick: () => vm.exportLogs()}, "Export")),
row(t, vm.i18n`Debug logs`, logButtons),
t.p({className: {hidden: vm => !vm.logsFeedbackMessage}}, vm => vm.logsFeedbackMessage),
t.p(["Debug logs contain application usage data including your username, the IDs or aliases of the rooms or groups you have visited, the usernames of other users and the names of files you send. They do not contain messages. For more information, review our ",
t.a({href: "https://element.io/privacy", target: "_blank", rel: "noopener"}, "privacy policy"), "."]),
);