Autofocus don't work with position: fixed

[ovk]

Expected behavior

It is possible to configure terminal to have focus on initialization, so there's no need to click on it.

Actual behavior

It appears like there's no easy way to achieve this.

[jcubic]

There is enabled option which if it's set to true make terminal enabled, it do that by default but not on Android where you need to manually focus in input to have virtual keyboard open.

[ovk]

With this sample code, the terminal still doesn't get a focus on loading.
I also tried calling focus() and enable() from within onInit callback, but it has no effect as well.

var consoleBlock = $('.console-block');
consoleBlock.terminal(function (command)
{
    if (command !== '')
    {
        var result = window.eval(command);
        if (result != undefined)
        {
            this.echo(String(result));
        }
    }
},
{
    name: 'test',
    prompt: '> ',
    exit: false,
    memory: true,
    enabled: true
});

[jcubic]

Do you have a demo somewhere because my demos are working. Also what browser/os you're using?

[ovk]

I'll try to create a minimal demo. Though, if it's working for you, maybe one of the styles or code in my project interfering with jquery.terminal.
Meanwhile, the browser I use is latest Chrome, and OS is Ubuntu 16.04.

[ovk]

I finally narrowed the issue down to this example: https://jsfiddle.net/txgg52fa/.
It's that terminal style that apparently kills autofocus, if you remove it - it starts working.

[jcubic]

Weird, will check it out.

[jcubic]

I completely don't know why it don't work, I've try to add wrapper that have position: relative inside terminal but this don't work, the only hack I've found is after you create terminal you run this:

setTimeout(function() {
    term.enable();
}, 100);

For some reason the terminal get disabled after init, will check this later today.

[ovk]

Thanks, I can use this workaround for now. Even this works:

setTimeout(function() {
    term.enable();
}, 0);

[jcubic]

Founded the issue and fixed it in devel branch (but the tests are still broken from other changes)

The other solution (that will work on 1.5.0 version) is to wrap the terminal in container that will have position: fixed https://jsfiddle.net/txgg52fa/1/

[jcubic]

note that position: fixed on terminal if the terminal is not 100% height and width will break the terminal because other elements inside rely on position: relative of the terminal.

[ovk]

Is the workaround with wrapping terminal inside a fixed container works for you? Because when I open https://jsfiddle.net/txgg52fa/1/ it doesn't seem to autofocus.

[jcubic]

Yes, you're right it don't work, also I was mistaken position: fixed work the same as position: relative for elements inside with position: absolute. the fix will be in 1.5.1.

[ovk]

Thanks @jcubic. I'll just use setTimeout workaround for now.

[jcubic]

The fix is in master in version 1.5.1