diff --git a/webview-ui/src/components/settings/ConcurrentFileReadsExperiment.tsx b/webview-ui/src/components/settings/ConcurrentFileReadsExperiment.tsx
index f2190aa7d2..fb1f0dc718 100644
--- a/webview-ui/src/components/settings/ConcurrentFileReadsExperiment.tsx
+++ b/webview-ui/src/components/settings/ConcurrentFileReadsExperiment.tsx
@@ -18,9 +18,16 @@ export const ConcurrentFileReadsExperiment = ({
const { t } = useAppTranslation()
const handleChange = (value: boolean) => {
- // Set to 1 if disabling to reset the setting
- if (!value) onMaxConcurrentFileReadsChange(1)
onEnabledChange(value)
+ // Set to 1 if disabling to reset the setting
+ if (!value) {
+ onMaxConcurrentFileReadsChange(1)
+ } else {
+ // When enabling, ensure we have a valid value > 1
+ if (!maxConcurrentFileReads || maxConcurrentFileReads <= 1) {
+ onMaxConcurrentFileReadsChange(15)
+ }
+ }
}
return (
@@ -48,15 +55,11 @@ export const ConcurrentFileReadsExperiment = ({
min={2}
max={100}
step={1}
- value={[
- maxConcurrentFileReads && maxConcurrentFileReads > 1 ? maxConcurrentFileReads : 15,
- ]}
+ value={[Math.max(2, maxConcurrentFileReads)]}
onValueChange={([value]) => onMaxConcurrentFileReadsChange(value)}
data-testid="max-concurrent-file-reads-slider"
/>
-
- {maxConcurrentFileReads && maxConcurrentFileReads > 1 ? maxConcurrentFileReads : 15}
-
+ {Math.max(2, maxConcurrentFileReads)}
diff --git a/webview-ui/src/components/settings/__tests__/ConcurrentFileReadsExperiment.test.tsx b/webview-ui/src/components/settings/__tests__/ConcurrentFileReadsExperiment.test.tsx
new file mode 100644
index 0000000000..590a072ee9
--- /dev/null
+++ b/webview-ui/src/components/settings/__tests__/ConcurrentFileReadsExperiment.test.tsx
@@ -0,0 +1,172 @@
+import { render, screen, fireEvent } from "@testing-library/react"
+import { ConcurrentFileReadsExperiment } from "../ConcurrentFileReadsExperiment"
+
+// Mock the translation hook
+jest.mock("@/i18n/TranslationContext", () => ({
+ useAppTranslation: () => ({
+ t: (key: string) => key,
+ }),
+}))
+
+// Mock ResizeObserver which is used by the Slider component
+global.ResizeObserver = jest.fn().mockImplementation(() => ({
+ observe: jest.fn(),
+ unobserve: jest.fn(),
+ disconnect: jest.fn(),
+}))
+
+describe("ConcurrentFileReadsExperiment", () => {
+ const mockOnEnabledChange = jest.fn()
+ const mockOnMaxConcurrentFileReadsChange = jest.fn()
+
+ beforeEach(() => {
+ jest.clearAllMocks()
+ })
+
+ it("should render with disabled state", () => {
+ render(
+ ,
+ )
+
+ const checkbox = screen.getByTestId("concurrent-file-reads-checkbox")
+ expect(checkbox).not.toBeChecked()
+
+ // Slider should not be visible when disabled
+ expect(screen.queryByTestId("max-concurrent-file-reads-slider")).not.toBeInTheDocument()
+ })
+
+ it("should render with enabled state", () => {
+ render(
+ ,
+ )
+
+ const checkbox = screen.getByTestId("concurrent-file-reads-checkbox")
+ expect(checkbox).toBeChecked()
+
+ // Slider should be visible when enabled
+ expect(screen.getByTestId("max-concurrent-file-reads-slider")).toBeInTheDocument()
+ expect(screen.getByText("20")).toBeInTheDocument()
+ })
+
+ it("should set maxConcurrentFileReads to 15 when enabling from disabled state", () => {
+ render(
+ ,
+ )
+
+ const checkbox = screen.getByTestId("concurrent-file-reads-checkbox")
+ fireEvent.click(checkbox)
+
+ expect(mockOnEnabledChange).toHaveBeenCalledWith(true)
+ expect(mockOnMaxConcurrentFileReadsChange).toHaveBeenCalledWith(15)
+ })
+
+ it("should set maxConcurrentFileReads to 1 when disabling", () => {
+ render(
+ ,
+ )
+
+ const checkbox = screen.getByTestId("concurrent-file-reads-checkbox")
+ fireEvent.click(checkbox)
+
+ expect(mockOnEnabledChange).toHaveBeenCalledWith(false)
+ expect(mockOnMaxConcurrentFileReadsChange).toHaveBeenCalledWith(1)
+ })
+
+ it("should not change maxConcurrentFileReads when enabling if already > 1", () => {
+ render(
+ ,
+ )
+
+ const checkbox = screen.getByTestId("concurrent-file-reads-checkbox")
+ fireEvent.click(checkbox)
+
+ expect(mockOnEnabledChange).toHaveBeenCalledWith(true)
+ // Should not call onMaxConcurrentFileReadsChange since value is already > 1
+ expect(mockOnMaxConcurrentFileReadsChange).not.toHaveBeenCalled()
+ })
+
+ it("should update value when slider changes", () => {
+ // Since the Slider component doesn't render a standard input,
+ // we'll test the component's interaction through its props
+ const { rerender } = render(
+ ,
+ )
+
+ // Verify initial value is displayed
+ expect(screen.getByText("15")).toBeInTheDocument()
+
+ // Simulate the slider change by re-rendering with new value
+ rerender(
+ ,
+ )
+
+ // Verify new value is displayed
+ expect(screen.getByText("50")).toBeInTheDocument()
+ })
+
+ it("should display minimum value of 2 when maxConcurrentFileReads is less than 2", () => {
+ render(
+ ,
+ )
+
+ // Should display 2 (minimum value) instead of 1
+ expect(screen.getByText("2")).toBeInTheDocument()
+ })
+
+ it("should set maxConcurrentFileReads to 15 when enabling with value of 0", () => {
+ render(
+ ,
+ )
+
+ const checkbox = screen.getByTestId("concurrent-file-reads-checkbox")
+ fireEvent.click(checkbox)
+
+ expect(mockOnEnabledChange).toHaveBeenCalledWith(true)
+ expect(mockOnMaxConcurrentFileReadsChange).toHaveBeenCalledWith(15)
+ })
+})