feat: improve unit tests and adding data-testid to slider and checkbox components

This commit is contained in:
Ton Hoang Nguyen (Bill) 2025-06-27 00:38:25 +01:00
parent 98e813d1d3
commit 91c16cbec4
2 changed files with 34 additions and 9 deletions

View file

@ -128,6 +128,7 @@ export const Gemini = ({
<div>
<Checkbox
data-testid="checkbox-custom-base-url"
checked={googleGeminiBaseUrlSelected}
onChange={(checked: boolean) => {
setGoogleGeminiBaseUrlSelected(checked)
@ -157,6 +158,7 @@ export const Gemini = ({
</label>
<div className="flex items-center space-x-2">
<Slider
data-testid="slider-top-p"
min={0}
max={1}
step={0.01}
@ -177,6 +179,7 @@ export const Gemini = ({
</label>
<div className="flex items-center space-x-2">
<Slider
data-testid="slider-top-k"
min={0}
max={100}
step={1}
@ -197,6 +200,7 @@ export const Gemini = ({
</label>
<div className="flex items-center space-x-2">
<Slider
data-testid="slider-max-output-tokens"
min={3000}
max={modelInfo.maxTokens}
step={1}
@ -227,6 +231,7 @@ export const Gemini = ({
</h3>
<div>
<Checkbox
data-testid="checkbox-custom-context-limit"
checked={isCustomContextLimit}
onChange={(checked: boolean) => {
setIsCustomContextLimit(checked)
@ -258,6 +263,7 @@ export const Gemini = ({
<div>
<div className="flex items-center gap-2">
<Slider
data-testid="slider-context-limit"
min={32000}
max={modelInfo?.contextWindow || 1048576}
step={1000}
@ -397,6 +403,7 @@ export const Gemini = ({
</h3>
<Checkbox
data-testid="checkbox-url-context"
checked={!!apiConfiguration.enableUrlContext}
onChange={(checked: boolean) => setApiConfigurationField("enableUrlContext", checked)}>
{t("settings:providers.geminiParameters.urlContext.title")}
@ -406,6 +413,7 @@ export const Gemini = ({
</div>
<Checkbox
data-testid="checkbox-grounding-search"
checked={!!apiConfiguration.enableGrounding}
onChange={(checked: boolean) => setApiConfigurationField("enableGrounding", checked)}>
{t("settings:providers.geminiParameters.groundingSearch.title")}

View file

@ -1,4 +1,3 @@
import React from "react"
import { render, screen, fireEvent } from "@testing-library/react"
import { Gemini } from "../Gemini"
import type { ProviderSettings } from "@roo-code/types"
@ -14,8 +13,8 @@ vi.mock("@vscode/webview-ui-toolkit/react", () => ({
}))
vi.mock("vscrui", () => ({
Checkbox: ({ children, checked, onChange }: any) => (
<label data-testid="checkbox-custom-context-limit">
Checkbox: ({ children, checked, onChange, "data-testid": testId, _ }: any) => (
<label data-testid={testId}>
<input type="checkbox" checked={checked} onChange={(e) => onChange(e.target.checked)} />
{children}
</label>
@ -23,9 +22,9 @@ vi.mock("vscrui", () => ({
}))
vi.mock("@src/components/ui", () => ({
Slider: ({ min, max, step, value, onValueChange }: any) => (
Slider: ({ min, max, step, value, onValueChange, "data-testid": testId, _ }: any) => (
<input
data-testid="slider"
data-testid={testId}
type="range"
min={min}
max={max}
@ -54,19 +53,35 @@ describe("Gemini provider settings", () => {
render(
<Gemini apiConfiguration={config} setApiConfigurationField={setApiField} currentModelId={defaultModelId} />,
)
expect(screen.queryByTestId("slider")).toBeNull()
expect(screen.queryByTestId("slider-context-limit")).toBeNull()
expect(screen.getByTestId("slider-top-p")).toBeInTheDocument()
expect(screen.getByTestId("slider-top-k")).toBeInTheDocument()
expect(screen.getByTestId("slider-max-output-tokens")).toBeInTheDocument()
})
it("enables custom context limit on checkbox toggle and shows slider with default value", () => {
const setApiField = vi.fn()
const config: ProviderSettings = {}
render(
const { rerender } = render(
<Gemini apiConfiguration={config} setApiConfigurationField={setApiField} currentModelId={defaultModelId} />,
)
const checkbox = screen.getByTestId("checkbox-custom-context-limit")
fireEvent.click(checkbox)
expect(setApiField).toHaveBeenCalledWith("contextLimit", defaultContextWindow)
const slider = screen.getByTestId("slider")
const updatedConfig = { ...config, contextLimit: defaultContextWindow }
rerender(
<Gemini
apiConfiguration={updatedConfig}
setApiConfigurationField={setApiField}
currentModelId={defaultModelId}
/>,
)
const slider = screen.getByTestId("slider-context-limit")
expect(slider).toHaveValue(defaultContextWindow.toString())
})
@ -77,8 +92,10 @@ describe("Gemini provider settings", () => {
render(
<Gemini apiConfiguration={config} setApiConfigurationField={setApiField} currentModelId={defaultModelId} />,
)
const slider = screen.getByTestId("slider")
const slider = screen.getByTestId("slider-context-limit")
expect(slider).toHaveValue(initialLimit.toString())
fireEvent.change(slider, { target: { value: "50000" } })
expect(setApiField).toHaveBeenCalledWith("contextLimit", 50000)
})