JS-0002 · Avoid using `console` in code that runs on browser

Avoid using console in code that runs on browser JS-0002

Bug risk

Major

a year ago — 2 years old

Avoid using console in code that runs on the browser

 8
 9function startCreateSlides() {
10  window.zhihui.slides.openCreateSlideWindow();
11  console.log("create");12}
13</script>
14

Avoid using console in code that runs on the browser

src/app/slides/project/creator.ts

88## PAGE 2`;
89  await writeFile(join(dir, "slides.md"), markdownFile);
90  commands.forEach((command) => {
91    console.log(command, dir);92    $(command, {
93      cwd: dir,
94    });

Avoid using console in code that runs on the browser

src/app/slides/downloader/download-binary.ts

14  const path = join(tmpdir(), url.split("/").pop());
15  console.log(path);
16  const stream = await fetch(url);
17  console.log(stream.headers);18  const arraybuffer = await stream.arrayBuffer();
19  const buffer = Buffer.from(arraybuffer);
20  await writeFile(path, buffer);

Avoid using console in code that runs on the browser

src/app/slides/downloader/download-binary.ts

12  const url = await getDownloadUrl();
13  console.log(url, url.split("/").pop(), tmpdir());
14  const path = join(tmpdir(), url.split("/").pop());
15  console.log(path);16  const stream = await fetch(url);
17  console.log(stream.headers);
18  const arraybuffer = await stream.arrayBuffer();

Avoid using console in code that runs on the browser

src/app/slides/downloader/download-binary.ts

10
11export async function downloadBinary() {
12  const url = await getDownloadUrl();
13  console.log(url, url.split("/").pop(), tmpdir());14  const path = join(tmpdir(), url.split("/").pop());
15  console.log(path);
16  const stream = await fetch(url);

Description

It is considered a best practice to avoid the use of any console methods in JavaScript code that will run on the browser.

NOTE: If your repository contains a server side project, you can add "nodejs" to the environment property of analyzer meta in .deepsource.toml. This will prevent this issue from getting raised. Documentation for the analyzer meta can be found here. Alternatively, you can silence this issue for your repository as shown here.

If a specific console call is meant to stay for other reasons, you can add a skipcq comment to that line. This will inform other developers about the reason behind the log's presence, and prevent DeepSource from flagging it.

Usually, console methods are only used for debugging, and can leak internal info to the client. Removing the console call will fix this issue.

Bad Practice

if (!secure(data)) {
  console.log("data is not secure", data) // `data` is visible to the client
}

console.table(tableObj)

Zhihui-Platform / client

Bad Practice

Recommended