Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit eb1f247

Browse files
Akos Kittakittaakos
Akos Kitta
authored andcommitted
fix: the focus in the sketchbook widget
Ref: #1720 Signed-off-by: Akos Kitta <a.kitta@arduino.cc>
1 parent 6e72be1 commit eb1f247

File tree

4 files changed

+47
-22
lines changed

4 files changed

+47
-22
lines changed

‎arduino-ide-extension/src/browser/library/library-list-widget.ts‎

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import { Installable } from '../../common/protocol';
2020
import { ListItemRenderer } from '../widgets/component-list/list-item-renderer';
2121
import { nls } from '@theia/core/lib/common';
2222
import { LibraryFilterRenderer } from '../widgets/component-list/filter-renderer';
23+
import { findChildTheiaButton } from '../utils/dom';
2324

2425
@injectable()
2526
export class LibraryListWidget extends ListWidget<
@@ -243,17 +244,7 @@ class MessageBoxDialog extends AbstractDialog<MessageBoxDialog.Result> {
243244

244245
protected override onAfterAttach(message: Message): void {
245246
super.onAfterAttach(message);
246-
let buttonToFocus: HTMLButtonElement | undefined = undefined;
247-
for (const child of Array.from(this.controlPanel.children)) {
248-
if (child instanceof HTMLButtonElement) {
249-
if (child.classList.contains('main')) {
250-
buttonToFocus = child;
251-
break;
252-
}
253-
buttonToFocus = child;
254-
}
255-
}
256-
buttonToFocus?.focus();
247+
findChildTheiaButton(this.controlPanel)?.focus();
257248
}
258249
}
259250
export namespace MessageBoxDialog {
Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import { notEmpty } from '@theia/core';
2+
3+
/**
4+
* Finds the closest child HTMLButtonElement representing a Theia button.
5+
* A button is a Theia button if it's a `<button>` element and has the `"theia-button"` class.
6+
* If an element has multiple Theia button children, this function prefers `"main"` over `"secondary"` button.
7+
*/
8+
export function findChildTheiaButton(
9+
element: HTMLElement,
10+
recursive = false
11+
): HTMLButtonElement | undefined {
12+
let button: HTMLButtonElement | undefined = undefined;
13+
const children = Array.from(element.children);
14+
for (const child of children) {
15+
if (
16+
child instanceof HTMLButtonElement &&
17+
child.classList.contains('theia-button')
18+
) {
19+
if (child.classList.contains('main')) {
20+
return child;
21+
}
22+
button = child;
23+
}
24+
}
25+
if (!button && recursive) {
26+
button = children
27+
.filter(isHTMLElement)
28+
.map((childElement) => findChildTheiaButton(childElement, true))
29+
.filter(notEmpty)
30+
.shift();
31+
}
32+
return button;
33+
}
34+
35+
function isHTMLElement(element: Element): element is HTMLElement {
36+
return element instanceof HTMLElement;
37+
}

‎arduino-ide-extension/src/browser/widgets/sketchbook/sketchbook-composite-widget.tsx‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import { BaseWidget } from '@theia/core/lib/browser/widgets/widget';
99
import { CommandService } from '@theia/core/lib/common/command';
1010
import { SketchbookTreeWidget } from './sketchbook-tree-widget';
1111
import { CreateNew } from '../sketchbook/create-new';
12+
import { findChildTheiaButton } from '../../utils/dom';
1213

1314
@injectable()
1415
export abstract class BaseSketchbookCompositeWidget<
@@ -18,16 +19,17 @@ export abstract class BaseSketchbookCompositeWidget<
1819
protected readonly commandService: CommandService;
1920

2021
private readonly compositeNode: HTMLElement;
22+
private readonly footerNode: HTMLElement;
2123
private readonly footerRoot: Root;
2224

2325
constructor() {
2426
super();
2527
this.compositeNode = document.createElement('div');
2628
this.compositeNode.classList.add('composite-node');
27-
constfooterNode = document.createElement('div');
28-
footerNode.classList.add('footer-node');
29-
this.compositeNode.appendChild(footerNode);
30-
this.footerRoot = createRoot(footerNode);
29+
this.footerNode = document.createElement('div');
30+
this.footerNode.classList.add('footer-node');
31+
this.compositeNode.appendChild(this.footerNode);
32+
this.footerRoot = createRoot(this.footerNode);
3133
this.node.appendChild(this.compositeNode);
3234
this.title.closable = false;
3335
}
@@ -51,6 +53,7 @@ export abstract class BaseSketchbookCompositeWidget<
5153
super.onActivateRequest(message);
5254
// Sending a resize message is needed because otherwise the tree widget would render empty
5355
this.onResize(Widget.ResizeMessage.UnknownSize);
56+
findChildTheiaButton(this.footerNode, true)?.focus();
5457
}
5558

5659
protected override onResize(message: Widget.ResizeMessage): void {

‎arduino-ide-extension/src/browser/widgets/sketchbook/sketchbook-widget.tsx‎

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -128,13 +128,7 @@ export class SketchbookWidget extends BaseWidget {
128128

129129
protected override onActivateRequest(message: Message): void {
130130
super.onActivateRequest(message);
131-
132-
// TODO: focus the active sketchbook
133-
// if (this.editor) {
134-
// this.editor.focus();
135-
// } else {
136-
// }
137-
this.node.focus();
131+
this.sketchbookCompositeWidget.activate();
138132
}
139133

140134
protected override onResize(message: Widget.ResizeMessage): void {

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /