The Select Component is not responding to the arrow keys

[Quaap70]

Laravel Prompts Version

I couldn't find out the prompts version.

Laravel Version

10.17.1

PHP Version

8.2

Operating System & Version

macOS 13.5 (M1)

Terminal Application

iTerm

Description

After installing a fresh laravel and creating a new model, I was asked Would you like any of the following?. As far as I understand, I should be able to select the desired options with the arrow keys. Unfortunately the arrow keys do not work, it only works with H and J.

I am using iTerm 3.4.19 (tried also the native terminal)
Apple MacBook Pro M1 Pro

Steps To Reproduce

[jessarcher]

Hey @Quaap70.

Thanks for reporting this. I haven't seen an issue with the arrow keys on macOS but I'll see if I can replicate this. If not, I might need your help figuring out the character codes that are being sent on your system.

[Quaap70]

Hey @jessarcher

Thanks for the quick response, and for taking the time to research this...

I tested it on my desktop and on my old MacBook, and on those devices it works fine. All computers configured almost identically

On my 2020 Mac Mini (M1) it works perfectly
On my old 2015 MacBook Pro (i7) it works perfectly

On all three devices iTerm is configured the same way, with oh-my-zsh and powerlevel10K. I've tried to figure out which character codes the arrow keys generate, but no idea where to look.

It works fine with just the H and J keys of course, so if I'm really the only one reporting this problem... Even with only H and J it works ten times better than before Prompts.

[jessarcher]

Thanks @Quaap70!

Could you try running the following minimal debugging script on the affected command line (e.g. php test.php):

<?php

$initialMode = shell_exec('stty -g');

register_shutdown_function(function () use ($initialMode) {
    echo 'Restoring TTY'.PHP_EOL;

    shell_exec('stty '.$initialMode);
});

shell_exec('stty -icanon -echo -isig');

while ($keys = fread(STDIN, 1024)) {
    echo json_encode($keys).PHP_EOL;

    if ($keys === "\x03") {
        exit(0);
    }
}

If you press the arrow keys, it should echo the keys being received. They're JSON-encoded as an easy way to escape the escape sequences, which would otherwise output non-printable characters and do weird things to your terminal. You can then press Ctrl+C to exit.

The stty commands are required to receive each key as it's typed, prevent the terminal from outputting them directly, and disable the default Ctrl+C behaviour so that the script can restore your terminal behaviour afterwards. See man stty for more information. No settings are persisted outside of the current terminal session, so if anything goes wrong you can just close and restart your terminal.

This is what the output looks like on my machine after pressing up, down, right, left, Ctrl+C:

[Quaap70]

Hey @jessarcher

Thanks for the response.

I ran your script and below is the result. The sequence is in the same order as in your example above:

"\u001bOA"
"\u001bOB"
"\u001bOC"
"\u001bOD"
"\u0003"
Restoring TTY

Hopefully this is helpful to you..

[jessarcher]

Thanks for that!

I haven't seen escape sequences with an O instead of a [. It seems like it could be "Single Shift Three" mentioned at https://en.wikipedia.org/wiki/ANSI_escape_code#Fe_Escape_sequences.

I can probably make Prompts respond to the sequences you pasted, but I'd like to understand it a bit more and ideally replicate it first. I'll pull out my old Macbook and mess around with iTerm settings to see what I can come up with.

[Quaap70]

I'm not sure if this is of any use to you, but I found the below script here on github. It seems my iTerm2 escape sequences are not totally unknown. Maybe the context of the script tells you something that will help you... I'm lost 😶

https://github.com/krajj7/BotHack/blob/master/jta26/de/mud/terminal/vt320.java

line 1926

[jessarcher]

Thanks!

This Stack Exchange post does a pretty good job of explaining the difference. Not sure why one of your iTerms would be sending the other ones but I don't see any issues supporting it.

I've created a PR at #40. It would be great if you could test it out for me as I haven't found a way of replicating it locally (even with the tput command from that post).

There are some test scripts in the playground directory that should be enough to test things without needing to set it up in a Laravel application.

[Quaap70]

Unfortunately I'm not that familiar with pull requests, and merging and testing them... Sorry 😔

The way is probably very cumbersome, and perhaps not the fastest, but I think it worked out in the end with the following steps:

I performed a new laravel installation. Then I overwrote the Prompts folder with the files from the main branche. And finally, I replaced the 7 modified files of your arrow-keys branch.

The result is positive, Prompts now responds to my arrow keys!

[jessarcher]

Thank you, @Quaap70! Those steps are fine 🙂

I'll close this issue now as #40 is ready to merge. The fix should be in the next version.

[shane-smith]

EDIT: Removed. I'm going to create a separate issue, as I'm only just realising that this one is for navigating between options, but my issue is in regards to being unable to select an option.

The new issue: #41

[Quaap70]

Thanks @jessarcher !