Prompt file imported from alex-foster-personal/t8e-gh-test (
.claude/commands/e2e/test_disable_input_debounce.md). Copyright stays with the author.
E2E Test: Input Disabling and Debouncing
Test input disabling during query execution and debouncing functionality in the Natural Language SQL Interface application.
User Story
As a user
I want the input area to be disabled while a query is processing
So that I don't accidentally type or submit multiple queries at once
Test Steps
-
Navigate to the
Application URL -
Take a screenshot of the initial state
-
Verify the page title is "Natural Language SQL Interface"
-
Verify the query input textbox is enabled and can accept text
-
Verify the query button is enabled
-
Click "Upload Data" button to open the modal
-
Click on "Users Data" sample data button to load sample data
-
Wait for the data to be loaded
-
Verify the users table appears in the Available Tables section
-
Enter the query: "Show me all users"
-
Take a screenshot of the query input before execution
-
Click the Query button
-
Immediately after clicking (within 100ms):
- Verify the query input textbox is disabled
- Verify the query button is disabled and shows loading spinner
- Try to type additional text in the query input
- Verify no additional text can be entered
-
Take a screenshot showing the disabled state
-
Wait for the query to complete
-
Verify the query input textbox is re-enabled
-
Verify the query button is re-enabled and shows "Query" text
-
Verify the results are displayed
-
Take a screenshot of the re-enabled state with results
-
Test debouncing:
- Enter a new query: "Count all users"
- Rapidly click the Query button 5 times within 1 second
- Verify only one query is executed (results should update once, not multiple times)
- Verify no errors are shown
-
Test keyboard shortcut with disabled state:
- Enter another query: "Show user names"
- Press Cmd+Enter (Mac) or Ctrl+Enter (Windows/Linux)
- Verify the input becomes disabled during execution
- Verify the input is re-enabled after completion
Success Criteria
- Query input is disabled during query execution
- Query button is disabled during query execution
- User cannot type in the textarea while a query is processing
- Input and button are re-enabled after query completion
- Debouncing prevents multiple rapid API requests
- Visual feedback is provided for disabled state
- 4 screenshots are taken
