Mouse click on InputField sets Focus to inner TextArea

[IlorDash]

When using InputField, I've encountered an issue where clicking on the field with the mouse sets the focus to the inner TextArea rather than the InputField itself or its Box. This behavior prevents SetFocusFunc method from being triggered as expected.

Below is the code I am using to create an InputField. For brevity, the header and dialogue setup have been omitted::

panel := tview.NewFlex().SetDirection(tview.FlexRow)
panel.SetBorder(true)

var msg string
message = tview.NewInputField().
	SetPlaceholder("Write a message...").
	SetFieldTextColor(tcell.ColorSilver).
	SetPlaceholderTextColor(tcell.ColorGray).
	SetChangedFunc(func(newMsg string) {
		msg = newMsg
	}).
	SetDoneFunc(func(key tcell.Key) {
		chat, err := client.SendMsg(msg)
		if err != nil {
			appConfig.LogErr(err, "failed to send msg")
			return
		}
		message.SetText("")
	})

message.SetFocusFunc(func() { message.SetPlaceholderTextColor(tcell.ColorSilver) })

panel.AddItem(header.panel, 0, 2, false).
	AddItem(dialogue, 0, 8, false).
	AddItem(message, 0, 1, false)

It seems like issue arises because InputField's MouseHandler calls the TextArea's mouse handler (https://github.com/rivo/tview/blob/master/inputfield.go#L670), resulting in the TextArea gaining focus. To resolve this, I think we need to call to Box.MouseHandler() instead to ensure the InputField.Box.focus is properly triggered on mouse click.

[IlorDash]

I discovered a bug when calling Box.MouseHandler() instead of textArea.MouseHandler(). The issue occurs when you first click to focus on an InputField, and then try to focus on a different InputField. The first field remains focused because the textArea's Box retains the focus, resulting in any typing still happening in the first InputField. Therefore, this solution doesn't work as intended. Do you have any suggestions on how to resolve this issue?

[rivo]

The latest commit should fix the issue with the focus callback.

Regarding your second issue, can you please post a brief code snippet that I can run to reproduce it?

[IlorDash]

Thanks, your commit really solved my problem!

To reproduce the second issue, you can use this example code:

package main

import (
	"github.com/gdamore/tcell/v2"
	"github.com/rivo/tview"
)

func main() {
	app := tview.NewApplication()

	flex := tview.NewFlex().SetDirection(tview.FlexRow)

	firstInputField := tview.NewInputField().
		SetPlaceholder("Write a message...").
		SetFieldTextColor(tcell.ColorSilver).
		SetPlaceholderTextColor(tcell.ColorGray).
		SetDoneFunc(func(key tcell.Key) {
			app.Stop()
		})

	firstInputField.SetFocusFunc(func() { firstInputField.SetPlaceholderTextColor(tcell.ColorBlack) })

	secondInputField := tview.NewInputField().
		SetLabel("Enter your name: ").
		SetPlaceholder("E.g. MyName").
		SetFieldWidth(10)

	flex.AddItem(firstInputField, 0, 1, false).
		AddItem(secondInputField, 0, 1, false)

	if err := app.SetRoot(flex, true).EnableMouse(true).Run(); err != nil {
		panic(err)
	}
}

You also need to make some changes to the tview package:

1. Don't use this commit that solved my issue.
2. Replace i.textArea.MouseHandler() with i.Box.MouseHandler() in tview/inputfiled.go:675.

To be clear, here is the tview version from my go.mod with which I reproduced the issue: v0.0.0-20240921122403-a64fc48d7654. I made my changes to tview, described above, to this version.

To reproduce the issue, follow these steps:

1. select firstInputField with the mouse;
2. placeholder text must change to black color;
3. type something;
4. select secondInputField with the mouse;
5. type something;
6. your typing will occur in firstInputField instead of secondInputField, because the focus remains on the firstInputField's Box.

[rivo]

This problem doesn't happen for me in the current version, at least not with the steps you listed. So unless you can demonstrate that it still exists in the latest version, I will consider this issue as "resolved".