Skip to content

dev-tool: Add option to enable extended livekit logs #3924

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
BillCarsonFr wants to merge 4 commits into
base: livekit
Choose a base branch
from
Open

dev-tool: Add option to enable extended livekit logs #3924

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
3bc8c05
dev-tool: Add option to enable extended livekit logs
BillCarsonFr Apr 24, 2026
25ac565
Merge branch 'livekit' into valere/devx/livekit_logs
BillCarsonFr May 11, 2026
2ac2216
review: Use Initializer instead of creating a component
BillCarsonFr May 11, 2026
f1b61a9
update developer settings tab snapshot
BillCarsonFr May 11, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 17 additions & 0 deletions src/initializer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,12 +23,17 @@ import {
createRoutesFromChildren,
matchRoutes,
} from "react-router-dom";
import {
setLogExtension as setLKLogExtension,
setLogLevel as setLKLogLevel,
} from "livekit-client";

import { getUrlParams } from "./UrlParams";
import { Config } from "./config/Config";
import { platform } from "./Platform";
import { isFailure } from "./utils/fetch";
import { initializeWidget } from "./widget";
import { enableExtendedLivekitLogs } from "./settings/settings.ts";

// This generates a map of locale names to their URL (based on import.meta.url), which looks like this:
// {
Expand Down Expand Up @@ -189,6 +194,18 @@ export class Initializer {

// Add the platform to the DOM, so CSS can query it
document.body.setAttribute("data-platform", platform);

// livekit logging configuration
setLKLogExtension((level, msg, context) => {
// we pass a synthetic logger name of "livekit" to the rageshake to make it easier to read
global.mx_rage_logger.log(level, "livekit", msg, context);
});

enableExtendedLivekitLogs.value$.subscribe((enabled) => {
setLKLogLevel(enabled ? "trace" : "info");
});

window.setLKLogLevel = setLKLogLevel;
}

public static init(): Promise<void> | null {
Expand Down
11 changes: 0 additions & 11 deletions src/main.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,27 +15,16 @@ import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import "./index.css";
import { logger } from "matrix-js-sdk/lib/logger";
import {
setLogExtension as setLKLogExtension,
setLogLevel as setLKLogLevel,
} from "livekit-client";

import { App } from "./App";
import { init as initRageshake } from "./settings/rageshake";
import { Initializer } from "./initializer";
import { AppViewModel } from "./state/AppViewModel";
import { globalScope } from "./state/ObservableScope";

window.setLKLogLevel = setLKLogLevel;

initRageshake().catch((e) => {
logger.error("Failed to initialize rageshake", e);
});
setLKLogLevel("info");
setLKLogExtension((level, msg, context) => {
// we pass a synthetic logger name of "livekit" to the rageshake to make it easier to read
global.mx_rage_logger.log(level, "livekit", msg, context);
});

logger.info(`Element Call ${import.meta.env.VITE_APP_VERSION || "dev"}`);

Expand Down
19 changes: 19 additions & 0 deletions src/settings/DeveloperSettingsTab.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ import {
matrixRTCMode as matrixRTCModeSetting,
customLivekitUrl as customLivekitUrlSetting,
MatrixRTCMode,
enableExtendedLivekitLogs as enableExtendedLivekitLogsSetting,
} from "./settings";
import styles from "./DeveloperSettingsTab.module.css";
import { useUrlParams } from "../UrlParams";
Expand Down Expand Up @@ -101,6 +102,10 @@ export const DeveloperSettingsTab: FC<Props> = ({
alwaysShowIphoneEarpieceSetting,
);

const [enableExtendedLivekitLogs, setEnableExtendedLivekitLogs] = useSetting(
enableExtendedLivekitLogsSetting,
);

const [customLivekitUrlUpdateError, setCustomLivekitUrlUpdateError] =
useState<string | null>(null);
const [customLivekitUrl, setCustomLivekitUrl] = useSetting(
Expand Down Expand Up @@ -227,6 +232,20 @@ export const DeveloperSettingsTab: FC<Props> = ({
)}
/>{" "}
</FieldRow>
<FieldRow>
<InputField
id="enableLivekitExtendedLogs"
type="checkbox"
label="Enable extended livekit logs"
checked={enableExtendedLivekitLogs}
onChange={useCallback(
(event: ChangeEvent<HTMLInputElement>): void => {
setEnableExtendedLivekitLogs(event.target.checked);
},
[setEnableExtendedLivekitLogs],
)}
/>{" "}
Copy link
Copy Markdown
Member

@robintown robintown May 1, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
/>{" "}
/>

</FieldRow>
<EditInPlace
onSubmit={(e) => e.preventDefault()}
helpLabel={
Expand Down
70 changes: 54 additions & 16 deletions src/settings/__snapshots__/DeveloperSettingsTab.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -186,6 +186,44 @@ exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
</label>
</div>

</div>
<div
class="fieldRow"
>
<div
class="field checkboxField"
>
<input
aria-describedby="_r_6_"
id="enableLivekitExtendedLogs"
type="checkbox"
/>
<label
for="enableLivekitExtendedLogs"
>
<div
class="checkbox"
>
<svg
fill="none"
height="24"
stroke="#000"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
viewBox="0 0 24 24"
width="24"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="m20 6-11 11-5-5"
/>
</svg>
</div>
Enable extended livekit logs
</label>
</div>

</div>
<form
class="_root_19upo_16"
Expand All @@ -195,25 +233,25 @@ exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
>
<label
class="_label_19upo_59"
for="radix-_r_6_"
for="radix-_r_7_"
>
Custom Livekit-url
</label>
<div
class="_controls_17lij_8"
>
<input
aria-describedby="radix-_r_7_"
aria-describedby="radix-_r_8_"
class="_control_d83jn_10"
id="radix-_r_6_"
id="radix-_r_7_"
name="input"
title=""
value=""
/>
</div>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_7_"
id="radix-_r_8_"
>
Currently, no overwrite is set. Url from well-known or config is used.
</span>
Expand All @@ -237,10 +275,10 @@ exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
class="_container_1ug7n_10"
>
<input
aria-describedby="radix-_r_9_ radix-_r_b_ radix-_r_d_"
aria-describedby="radix-_r_a_ radix-_r_c_ radix-_r_e_"
checked=""
class="_input_1ug7n_18"
id="radix-_r_8_"
id="radix-_r_9_"
name="_r_0_"
title=""
type="radio"
Expand All @@ -256,13 +294,13 @@ exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
>
<label
class="_label_19upo_59"
for="radix-_r_8_"
for="radix-_r_9_"
>
Legacy: state events & oldest membership SFU
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_9_"
id="radix-_r_a_"
>
Compatible with old versions of EC that do not support multi SFU
</span>
Expand All @@ -278,9 +316,9 @@ exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
class="_container_1ug7n_10"
>
<input
aria-describedby="radix-_r_9_ radix-_r_b_ radix-_r_d_"
aria-describedby="radix-_r_a_ radix-_r_c_ radix-_r_e_"
class="_input_1ug7n_18"
id="radix-_r_a_"
id="radix-_r_b_"
name="_r_0_"
title=""
type="radio"
Expand All @@ -296,13 +334,13 @@ exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
>
<label
class="_label_19upo_59"
for="radix-_r_a_"
for="radix-_r_b_"
>
Compatibility: state events & multi SFU
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_b_"
id="radix-_r_c_"
>
Compatible with homeservers that do not support sticky events (but all other EC clients are v0.17.0 or later)
</span>
Expand All @@ -318,9 +356,9 @@ exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
class="_container_1ug7n_10"
>
<input
aria-describedby="radix-_r_9_ radix-_r_b_ radix-_r_d_"
aria-describedby="radix-_r_a_ radix-_r_c_ radix-_r_e_"
class="_input_1ug7n_18"
id="radix-_r_c_"
id="radix-_r_d_"
name="_r_0_"
title=""
type="radio"
Expand All @@ -336,13 +374,13 @@ exports[`DeveloperSettingsTab > renders and matches snapshot 1`] = `
>
<label
class="_label_19upo_59"
for="radix-_r_c_"
for="radix-_r_d_"
>
Matrix 2.0: sticky events & multi SFU
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id="radix-_r_d_"
id="radix-_r_e_"
>
Compatible only with homservers supporting sticky events and all EC clients v0.17.0 or later
</span>
Expand Down
5 changes: 5 additions & 0 deletions src/settings/settings.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -129,6 +129,11 @@ export const alwaysShowIphoneEarpiece = new Setting<boolean>(
false,
);

export const enableExtendedLivekitLogs = new Setting<boolean>(
"extended-livekit-logs",
false,
);

export enum MatrixRTCMode {
Legacy = "legacy",
Compatibility = "compatibility",
Expand Down
Loading