[js] Adding logger documentation

[TamsilAmani]

Description

Documentation on how to use Logging feature in JS binding. Formatting documentation for Ruby and JS.

Motivation and Context

SeleniumHQ/selenium#10944

Types of changes

• Change to the site (I have double-checked the Netlify deployment, and my changes look good)
• Code example added (and I also added the example to all translated languages)
• Improved translation
• Added new translation (and I also added a notice to each document missing translation)

Checklist

• I have read the contributing document.
• I have used hugo to render the site/docs locally and I am sure it works.

[netlify]

✅ Deploy Preview for selenium-dev ready!

Name	Link
🔨 Latest commit	532a104
🔍 Latest deploy log	https://app.netlify.com/sites/selenium-dev/deploys/6441297d0c909900088584d5
😎 Deploy Preview	https://deploy-preview-1321--selenium-dev.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[titusfortner]

I think we should put this whole page in a tab rather than bullet points per language. What do you think?

[titusfortner]

This is formatted incorrectly. We changed how tabs need to display code with the latest Docsy update, needs to be text=true instead of code=false

And can we move & update the {{< alert-content >}} lines to go into the tabs that don't have information?

Thanks!

[TamsilAmani]

Thank you for the help regarding formatting @titusfortner. I have pushed the changes.

[titusfortner]

A few things I'm not clear on...

Also, can we get an example of what actual output looks like based on example code?

[TamsilAmani]

A few things I'm not clear on...

Also, can we get an example of what actual output looks like based on example code?

Can you elaborate this a little please @titusfortner? Do you want to show outputs for different languages in their respective tabs along with a working sample code?

[titusfortner]

Do you want to show outputs for different languages in their respective tabs along with a working sample code

I meant like just a line showing actual output. Like this:

https://github.com/SeleniumHQ/seleniumhq.github.io/blob/trunk/website_and_docs/content/documentation/webdriver/troubleshooting/logging.en.md?plain=1#L44-L45

[titusfortner]

A few thoughts to make it more language-agnostic. I can update the Ruby tab things after the next pass. Thanks!

[TamsilAmani]

Please have a look @titusfortner. Let me know if any changes are to be made. This PR only adds JS and ruby sections. For other bindings I'll make separate PRs.

[titusfortner]

Looks good! A couple minor tweaks.

[TamsilAmani]

Changes pushed.

[titusfortner]

Oh, and this probably should use markdown instead of html.

https://www.selenium.dev/documentation/about/style/#using-markdown-in-a-tab

need to use {{% tab header="Java" %}} instead of {{< tab header="Java" >}}

[TamsilAmani]

Ah! Thank you for that link. I was just wondering how to use MD instead of HTML and was all over the internet for the solution. Will push the changes soon.

[titusfortner]

lol, yeah, it isn't obvious. I only know because I was paying attention to those specific changes when they were made (we didn't used to be able to do text in the tabs of any kind).

[diemol]

I guess we need to have the files in the other languages in order to merge this.

[TamsilAmani]

@diemol So should I push the docs for Java and Python in this same branch? (Also I haven't explored how things are done in C# and Kotlin hence that might take time)

[titusfortner]

No, he means the other translated md files. Just copy paste what you have over and our amazing translators will do the rest.

[TamsilAmani]

@titusfortner The alert-content is not working with markdown style (%). So I have left the tabs which use alerts to still use html (<>). The markdown style can be done when these tabs are filled with their content.

@diemol I have added other language file.

[diemol]

Thank you, @TamsilAmani!