8000 Slightly imporved pyrepl (#1296) · ocdex/pyscript@c8becca · GitHub
[go: up one dir, main page]
Skip to content

Commit c8becca

Browse files
WebReflectionWebReflection
authored
Slightly imporved pyrepl (pyscript#1296)
 * removed unnecessary getAttribute * removed unnecessary shadow and ShadowDOM in general, as it was never used * dropped redundant constructor * removed unnecessary usage of the label element * fixed redundant always-same buttons IDs
1 parent 543a272 commit c8becca

File tree

3 files changed

+11
-39
lines changed

3 files changed

+11
-39
lines changed

‎pyscriptjs/src/components/pyrepl.ts

Lines changed: 7 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { keymap, Command } from '@codemirror/view';
66
import { defaultKeymap } from '@codemirror/commands';
77
import { oneDarkTheme } from '@codemirror/theme-one-dark';
88

9-
import { getAttribute, ensureUniqueId, htmlDecode } from '../utils';
9+
import { ensureUniqueId, htmlDecode } from '../utils';
1010
import { pyExec } from '../pyexec';
1111
import { getLogger } from '../logger';
1212
import { InterpreterClient } from '../interpreter_client';
@@ -20,31 +20,20 @@ export function make_PyRepl(interpreter: InterpreterClient, app: PyScriptApp) {
2020
/* High level structure of py-repl DOM, and the corresponding JS names.
2121
2222
this <py-repl>
23-
shadow #shadow-root
24-
<slot></slot>
2523
boxDiv <div class='py-repl-box'>
26-
editorLabel <label>...</label>
2724
editorDiv <div class="py-repl-editor"></div>
2825
outDiv <div class="py-repl-output"></div>
2926
</div>
3027
</py-repl>
3128
*/
3229
class PyRepl extends HTMLElement {
33-
shadow: ShadowRoot;
3430
outDiv: HTMLElement;
3531
editor: EditorView;
3632
stdout_manager: Stdio | null;
3733
stderr_manager: Stdio | null;
3834

39-
constructor() {
40-
super();
41-
}
42-
4335
connectedCallback() {
4436
ensureUniqueId(this);
45-
this.shadow = this.attachShadow({ mode: 'open' });
46-
const slot = document.createElement('slot');
47-
this.shadow.appendChild(slot);
4837

4938
if (!this.hasAttribute('exec-id')) {
5039
this.setAttribute('exec-id', '0');
@@ -77,7 +66,7 @@ export function make_PyRepl(interpreter: InterpreterClient, app: PyScriptApp) {
7766
]),
7867
];
7968

80-
if (getAttribute(this, 'theme') === 'dark') {
69+
if (this.getAttribute('theme') === 'dark') {
8170
extensions.push(oneDarkTheme);
8271
}
8372

@@ -97,10 +86,8 @@ export function make_PyRepl(interpreter: InterpreterClient, app: PyScriptApp) {
9786
boxDiv.className = 'py-repl-box';
9887

9988
const editorDiv = this.makeEditorDiv();
100-
const editorLabel = this.makeLabel('Python Script Area', editorDiv);
10189
this.outDiv = this.makeOutDiv();
10290

103-
boxDiv.append(editorLabel);
10491
boxDiv.appendChild(editorDiv);
10592
boxDiv.appendChild(this.outDiv);
10693

@@ -109,35 +96,21 @@ export function make_PyRepl(interpreter: InterpreterClient, app: PyScriptApp) {
10996

11097
makeEditorDiv(): HTMLElement {
11198
const editorDiv = document.createElement('div');
112-
editorDiv.id = 'code-editor';
11399
editorDiv.className = 'py-repl-editor';
100+
editorDiv.setAttribute('aria-label', 'Python Script Area');
114101
editorDiv.appendChild(this.editor.dom);
115102

116103
const runButton = this.makeRunButton();
117-
const runLabel = this.makeLabel('Python Script Run Button', runButton);
118-
editorDiv.appendChild(runLabel);
119104
editorDiv.appendChild(runButton);
120105

121106
return editorDiv;
122107
}
123108

124-
makeLabel(text: string, elementFor: HTMLElement): HTMLElement {
125-
ensureUniqueId(elementFor);
126-
const lbl = document.createElement('label');
127-
lbl.innerHTML = text;
128-
lbl.htmlFor = elementFor.id;
129-
// XXX this should be a CSS class
130-
// Styles that we use to hide the labels whilst also keeping it accessible for screen readers
131-
const labelStyle = 'overflow:hidden; display:block; width:1px; height:1px';
132-
lbl.setAttribute('style', labelStyle);
133-
return lbl;
134-
}
135-
136109
makeRunButton(): HTMLElement {
137110
const runButton = document.createElement('button');
138-
runButton.id = 'runButton';
139111
runButton.className = 'absolute py-repl-run-button';
140112
runButton.innerHTML = RUNBUTTON;
113+
runButton.setAttribute('aria-label', 'Python Script Run Button');
141114
runButton.addEventListener('click', this.execute.bind(this) as (e: MouseEvent) => void);
142115
return runButton;
143116
}
@@ -161,13 +134,13 @@ export function make_PyRepl(interpreter: InterpreterClient, app: PyScriptApp) {
161134
// execute the python code
162135
app.plugins.beforePyReplExec({ interpreter: interpreter, src: pySrc, outEl: outEl, pyReplTag: this });
163136
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
164-
const pyResult = (await pyExec(interpreter, pySrc, outEl)).result;
137+
const { result } = await pyExec(interpreter, pySrc, outEl);
165138
app.plugins.afterPyReplExec({
166139
interpreter: interpreter,
167140
src: pySrc,
168141
outEl: outEl,
169142
pyReplTag: this,
170-
result: pyResult, // eslint-disable-line @typescript-eslint/no-unsafe-assignment
143+
result, // eslint-disable-line @typescript-eslint/no-unsafe-assignment
171144
});
172145

173146
this.autogenerateMaybe();
@@ -190,7 +163,7 @@ export function make_PyRepl(interpreter: InterpreterClient, app: PyScriptApp) {
190163

191164
//Attributes to be copied from old REPL to auto-generated REPL
192165
for (const attribute of ['root', 'output-mode', 'output', 'stderr']) {
193-
const attr = getAttribute(this, attribute);
166+
const attr = this.getAttribute(attribute);
194167
if (attr) {
195168
newPyRepl.setAttribute(attribute, attr);
196169
}

‎pyscriptjs/tests/integration/test_py_repl.py

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,8 @@ def test_repl_loads(self):
2424
<py-repl></py-repl>
2525
"""
2626
)
27-
py_repl = self.page.query_selector("py-repl")
27+
py_repl = self.page.query_selector("py-repl .py-repl-box")
2828
assert py_repl
29-
assert "Python" in py_repl.inner_text()
3029

3130
def test_execute_preloaded_source(self):
3231
"""
@@ -69,7 +68,7 @@ def test_execute_on_shift_enter(self):
6968
</py-repl>
7069
"""
7170
)
72-
self.page.wait_for_selector("#runButton")
71+
self.page.wait_for_selector("py-repl .py-repl-run-button")
7372
self.page.keyboard.press("Shift+Enter")
7473
wait_for_render(self.page, "*", "hello world")
7574

‎pyscriptjs/tests/integration/test_zz_examples.py

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -299,7 +299,7 @@ def test_repl(self):
299299
wait_for_render(self.page, "*", "<py-repl.*?>")
300300

301301
self.page.locator("py-repl").type("display('Hello, World!')")
302-
self.page.locator("#runButton").click()
302+
self.page.locator("py-repl .py-repl-run-button").click()
303303

304304
assert (
305305
self.page.locator("#my-repl-repl-output").text_content() == "Hello, World!"
@@ -322,7 +322,7 @@ def test_repl2(self):
322322
wait_for_render(self.page, "*", "<py-repl.*?>")
323323
# confirm we can import utils and run one command
324324
self.page.locator("py-repl").type("import utils\ndisplay(utils.now())")
325-
self.page.wait_for_selector("#runButton").click()
325+
self.page.wait_for_selector("py-repl .py-repl-run-button").click()
326326
# Make sure the output is in the page
327327
self.page.wait_for_selector("#my-repl-1")
328328
# utils.now returns current date time

0 commit comments

Comments
 (0)
0