added badge codes and fixed ruby code example

shbenzer commented 2 weeks ago

User description

Made improvements to Shadow-Dom section: made ruby code of type code instead of text, added badge codes to missing exampes

Description

added badge codes to missing examples in shadow dom sections made ruby code of type code instead of type text

Motivation and Context

increases readability

Types of changes

[x] Change to the site (I have double-checked the Netlify deployment, and my changes look good)
[x] 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

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

PR Type

documentation

Description

Updated the Ruby code examples to be of type code instead of text across multiple language documentation files.
Added badge codes to the JavaScript and Kotlin examples to enhance visibility and consistency.
These changes improve the readability and presentation of the Shadow DOM examples in the documentation.

Changes walkthrough 📝

Relevant files

Documentation

finders.en.md `Update code formatting and add badges in English documentation` website_and_docs/content/documentation/webdriver/elements/finders.en.md Changed Ruby tab from text to code type. Added badge codes to JavaScript and Kotlin examples.	+5/-3
finders.ja.md `Update code formatting and add badges in Japanese documentation` website_and_docs/content/documentation/webdriver/elements/finders.ja.md Changed Ruby tab from text to code type. Added badge codes to JavaScript and Kotlin examples.	+5/-3
finders.pt-br.md `Update code formatting and add badges in Portuguese documentation` website_and_docs/content/documentation/webdriver/elements/finders.pt-br.md Changed Ruby tab from text to code type. Added badge codes to JavaScript and Kotlin examples.	+5/-3
finders.zh-cn.md `Update code formatting and add badges in Chinese documentation` website_and_docs/content/documentation/webdriver/elements/finders.zh-cn.md Changed Ruby tab from text to code type. Added badge codes to JavaScript and Kotlin examples.	+5/-3

💡 PR-Agent usage: Comment /help on the PR to get a list of all available PR-Agent tools and their descriptions

netlify[bot] commented 2 weeks ago

Deploy request for selenium-dev pending review.

Visit the deploys page to approve it

Name	Link
Latest commit	63854b51e5a3d2032beb5edcfe7eba89da8fe4f8

codiumai-pr-agent-pro[bot] commented 2 weeks ago

PR Reviewer Guide 🔍

⏱️ Estimated effort to review: 1 🔵⚪⚪⚪⚪

🧪 No relevant tests

🔒 No security concerns identified

⚡ No key issues to review

codiumai-pr-agent-pro[bot] commented 2 weeks ago

PR Code Suggestions ✨

Category	Suggestion	Score
Enhancement	Replace placeholder code with actual JavaScript and Kotlin examples ___ Consider adding actual JavaScript and Kotlin code examples instead of using the `{{<` `badge-code >}}` shortcode. This would provide more value to users looking for specific implementation details in these languages. [website_and_docs/content/documentation/webdriver/elements/finders.en.md [139-143]](https://github.com/SeleniumHQ/seleniumhq.github.io/pull/1897/files#diff-e21fb1eabd6a7eaf605f8f733ad4e5406d5ad60908a37a6da9b2c363c021ceaeR139-R143) ```diff -{{< tab header="JavaScript" text=true >}} -{{< badge-code >}} +{{< tab header="JavaScript" >}} +const shadowHost = await driver.findElement(By.css('#shadow_host')); +const shadowRoot = await shadowHost.getShadowRoot(); +const shadowContent = await shadowRoot.findElement(By.css('#shadow_content')); {{< /tab >}} -{{< tab header="Kotlin" text=true >}} -{{< badge-code >}} +{{< tab header="Kotlin" >}} +val shadowHost = driver.findElement(By.cssSelector("#shadow_host")) +val shadowRoot = shadowHost.getShadowRoot() +val shadowContent = shadowRoot.findElement(By.cssSelector("#shadow_content")) {{< /tab >}} ``` - [ ] Apply this suggestion Suggestion importance[1-10]: 9 Why: The suggestion to replace the placeholder `{{< badge-code >}}` with actual JavaScript and Kotlin code examples is highly beneficial. It provides concrete examples that enhance the documentation's value by offering specific implementation details, which is crucial for users seeking practical guidance.	9

SeleniumHQ / seleniumhq.github.io