scriptoriumadmin/Roo-Code
1
0
Fork 0
mirror of https://github.com/RooVetGit/Roo-Code.git synced 2026-08-28 05:27:24 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: show send button when only images are selected in chat textarea (#8423)

Browse source 
Co-authored-by: Roo Code <roomote@roocode.com>
Co-authored-by: Matt Rubens <mrubens@users.noreply.github.com>
This commit is contained in:
roomote[bot] 2025-09-30 17:12:53 -04:00 • committed by GitHub
parent c552027960
commit 3e47e88c01
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 85 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
webview-ui/src/components/chat/ChatTextArea.tsx
View file

@ -247,10 +247,10 @@ export const ChatTextArea = forwardRef<HTMLTextAreaElement, ChatTextAreaProps>(
const allModes = useMemo(() => getAllModes(customModes), [customModes])
// Memoized check for whether the input has content
// Memoized check for whether the input has content (text or images)
const hasInputContent = useMemo(() => {
return inputValue.trim().length > 0
}, [inputValue])
return inputValue.trim().length > 0 || selectedImages.length > 0
}, [inputValue, selectedImages])
const queryItems = useMemo(() => {
return [

82
webview-ui/src/components/chat/__tests__/ChatTextArea.spec.tsx
View file

@ -1057,4 +1057,86 @@ describe("ChatTextArea", () => {
expect(apiConfigDropdown).toHaveAttribute("disabled")
})
})
describe("send button visibility", () => {
it("should show send button when there are images but no text", () => {
const { container } = render(
<ChatTextArea
{...defaultProps}
inputValue=""
selectedImages={["data:image/png;base64,test1", "data:image/png;base64,test2"]}
/>,
)
// Find the send button by looking for the button with SendHorizontal icon
const buttons = container.querySelectorAll("button")
const sendButton = Array.from(buttons).find(
(button) => button.querySelector(".lucide-send-horizontal") !== null,
)
expect(sendButton).toBeInTheDocument()
// Check that the button is visible (has opacity-100 class when content exists)
expect(sendButton).toHaveClass("opacity-100")
expect(sendButton).toHaveClass("pointer-events-auto")
expect(sendButton).not.toHaveClass("opacity-0")
expect(sendButton).not.toHaveClass("pointer-events-none")
})
it("should hide send button when there is no text and no images", () => {
const { container } = render(<ChatTextArea {...defaultProps} inputValue="" selectedImages={[]} />)
// Find the send button by looking for the button with SendHorizontal icon
const buttons = container.querySelectorAll("button")
const sendButton = Array.from(buttons).find(
(button) => button.querySelector(".lucide-send-horizontal") !== null,
)
expect(sendButton).toBeInTheDocument()
// Check that the button is hidden (has opacity-0 class when no content)
expect(sendButton).toHaveClass("opacity-0")
expect(sendButton).toHaveClass("pointer-events-none")
expect(sendButton).not.toHaveClass("opacity-100")
expect(sendButton).not.toHaveClass("pointer-events-auto")
})
it("should show send button when there is text but no images", () => {
const { container } = render(<ChatTextArea {...defaultProps} inputValue="Some text" selectedImages={[]} />)
// Find the send button by looking for the button with SendHorizontal icon
const buttons = container.querySelectorAll("button")
const sendButton = Array.from(buttons).find(
(button) => button.querySelector(".lucide-send-horizontal") !== null,
)
expect(sendButton).toBeInTheDocument()
// Check that the button is visible
expect(sendButton).toHaveClass("opacity-100")
expect(sendButton).toHaveClass("pointer-events-auto")
})
it("should show send button when there is both text and images", () => {
const { container } = render(
<ChatTextArea
{...defaultProps}
inputValue="Some text"
selectedImages={["data:image/png;base64,test1"]}
/>,
)
// Find the send button by looking for the button with SendHorizontal icon
const buttons = container.querySelectorAll("button")
const sendButton = Array.from(buttons).find(
(button) => button.querySelector(".lucide-send-horizontal") !== null,
)
expect(sendButton).toBeInTheDocument()
// Check that the button is visible
expect(sendButton).toHaveClass("opacity-100")
expect(sendButton).toHaveClass("pointer-events-auto")
})
})
})