Button component setFocus documentation

[nikolab-pn]

Hi, can you please add setFocus function to ducumentation for scale button. Also why is the function named setFocus and not just focus like it is usually?

[acstll]

Sure, we can update the docs. Thanks for the reminder.

Also why is the function named setFocus and not just focus like it is usually?

it's called setFocus because we're focusing the actual button element inside the Shadow DOM, and mainly because, for correctness, we don't want to override the native focus method on the scale-button custom element.

[nikolab-pn]

Ok, thank you for explanation.

The problem for me was when I close modal window I want to return focus to element that was focused before modal was open. Regular html elements support focus() function so I can use that, but if I'm returning focus to scale-button than I need to use setFocus(). I was trying to create some generic way to do this but maybe some other approach would be better.

[acstll]

Sure.

If you're talking about some abstraction or helper, you could check for the existence of a setFocus method, otherwise call focus directly?

I would love to have this feature built-in, that focus returns to the element that last had focus before the modal being opened, but I'm not sure if it's really possible…

[acstll]

(Documenting methods in Storybook via the "args table" is not possible yet, apparently in 6.5: https://github.com/storybookjs/storybook/issues/13105)

[tshimber]

@acstll hi guys! maybe you could also suggest, how should I put focus to scale-button in js? should i use this method somehow? seems not to work for me, and simple focus() as well.. I guess i do smth not correct

[tshimber]

I used such trashy thing, it's looking awful and it's working only with giant timeout setTimeout(() => { const btn = document.getElementById('scale-btn-id').shadowRoot.querySelector('button'); console.log(btn); btn.focus(); }, 1200);