Skip to content

Commit 043c1ff

Browse files
krassowskikrassowski
authored
Merge pull request #231 from bollwyvl/add-editor-theme-styles
use more theme variables, start per-theme work
2 parents d9a9334 + 3cae879 commit 043c1ff

File tree

15 files changed

+337
-60
lines changed

15 files changed

+337
-60
lines changed

‎CHANGELOG.md

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
## CHANGELOG
22

3+
### `@krassowski/jupyterlab-lsp 1.0.1` (unreleased)
4+
5+
- bug fixes
6+
7+
- fixes currently-highlighted token in dark editor themes against light lab theme
8+
(and vice versa) ([#195][])
9+
10+
[#195]: https://github.com/krassowski/jupyterlab-lsp/issues/195
11+
312
### `@krassowski/jupyterlab-lsp 1.0.0` (2020-03-14)
413

514
- features

‎atest/01_Editor.robot

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,7 @@
22
Suite Setup Setup Suite For Screenshots editor
33
Force Tags ui:editor
44
Resource Keywords.robot
5-
6-
*** Variables ***
7-
${MENU EDITOR} xpath://div[contains(@class, 'lm-Menu-itemLabel')][contains(., "Editor")]
8-
${MENU JUMP} xpath://div[contains(@class, 'lm-Menu-itemLabel')][contains(text(), "Jump to definition")]
9-
${CM CURSOR} css:.CodeMirror-cursor
10-
${CM CURSORS} css:.CodeMirror-cursors:not([style='visibility: hidden'])
5+
Resource Variables.robot
116

127
*** Test Cases ***
138
Bash

‎atest/06_Style.robot

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
*** Settings ***
2+
Suite Setup Setup Suite For Screenshots style
3+
Force Tags ui:editor aspect:style
4+
Resource Keywords.robot
5+
Resource Variables.robot
6+
Library Collections
7+
8+
*** Variables ***
9+
${THEME NAMES} ${EMPTY}
10+
11+
*** Test Cases ***
12+
Light
13+
Screenshot Editor Themes with Lab Theme JupyterLab Light
14+
15+
Dark
16+
Screenshot Editor Themes with Lab Theme JupyterLab Dark
17+
18+
*** Keywords ***
19+
Screenshot Editor Themes with Lab Theme
20+
[Arguments] ${lab theme} ${file}=style.py ${notebook}=Diagnostic.ipynb
21+
${norm lab theme} = Set Variable ${lab theme.lower().replace(" ", "-")}
22+
Set Tags theme:lab:${norm lab theme}
23+
Set Screenshot Directory ${OUTPUT DIR}${/}style${/}${norm lab theme}
24+
Copy File examples${/}${file} ${OUTPUT DIR}${/}home${/}${file}
25+
Run Keyword If "${THEME NAMES}" == "" Wait Until Keyword Succeeds 3x 1s Get Theme Names
26+
Lab Command Use ${lab theme} Theme
27+
Try to Close All Tabs
28+
Setup Notebook python ${notebook} isolated=${False}
29+
Open ${file} in ${MENU EDITOR}
30+
Drag and Drop By Offset ${JLAB XP DOCK TAB}\[contains(., '${file}')] -400 400
31+
Ensure Sidebar Is Closed
32+
Click Element ${JLAB XP DOCK TAB}\[contains(., '${file}')]
33+
Click the second Accumulate in Notebook
34+
Capture Page Screenshot 00-notebook.png
35+
FOR ${editor theme} IN @{THEME NAMES}
36+
Capture Theme Screenshot ${editor theme}
37+
END
38+
[Teardown] Clean Up After Working With File ${file}
39+
40+
Capture Theme Screenshot
41+
[Arguments] ${editor theme}
42+
Change Editor Theme ${editor theme}
43+
Wait Until Fully Initialized
44+
Wait Until Page Contains Element css:.cm-lsp-diagnostic timeout=20s
45+
Click the second Accumulate in FileEditor
46+
Capture Page Screenshot 01-editor-${editor theme.replace(' ', '-')}.png
47+
48+
Click the second Accumulate in ${editor}
49+
Click Element //div[contains(@class, 'jp-${editor}')]//div[contains(@class,'CodeMirror')]//span[text() = 'accumulate']
50+
51+
Change Editor Theme
52+
[Arguments] ${editor theme}
53+
Open Editor Theme Menu
54+
${sel} = Set Variable xpath://div[contains(@class, 'lm-Menu-itemLabel')][contains(text(), "${editor theme}")]
55+
Wait Until Page Contains Element ${sel}
56+
Mouse Over ${sel}
57+
Click Element ${sel}
58+
59+
Open Editor Theme Menu
60+
Wait Until Page Contains Element ${MENU SETTINGS}
61+
Mouse Over ${MENU SETTINGS}
62+
Click Element ${MENU SETTINGS}
63+
Wait Until Page Contains Element ${MENU EDITOR THEME}
64+
Mouse Over ${MENU EDITOR THEME}
65+
Click Element ${MENU EDITOR THEME}
66+
67+
Get Theme Names
68+
Open Editor Theme Menu
69+
${els} = Get WebElements css:[data-command\="codemirror:change-theme"]
70+
${theme names} = Create List
71+
FOR ${element} IN @{els}
72+
Append To List ${theme names} ${element.text}
73+
END
74+
Set Suite Variable ${THEME NAMES} ${theme names}

‎atest/Keywords.robot

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -158,6 +158,11 @@ Ensure File Browser is Open
158158
${els} = Get WebElements ${sel}
159159
Run Keyword If ${els.__len__()} Click Element ${sel}
160160

161+
Ensure Sidebar Is Closed
162+
[Arguments] ${side}=left
163+
${els} = Get WebElements css:#jp-${side}-stack
164+
Run Keyword If ${els.__len__()} Click Element css:.jp-mod-${side} .lm-TabBar-tab.lm-mod-current
165+
161166
Open Context Menu for File
162167
[Arguments] ${file}
163168
Ensure File Browser is Open
@@ -195,15 +200,15 @@ Clean Up After Working With File
195200
Reset Application State
196201

197202
Setup Notebook
198-
[Arguments] ${Language} ${file}
203+
[Arguments] ${Language} ${file} ${isolated}=${True}
199204
Set Tags language:${Language.lower()}
200-
Set Screenshot Directory ${OUTPUT DIR}${/}screenshots${/}notebook${/}${TEST NAME.replace(' ', '_')}
205+
Run Keyword If ${isolated} Set Screenshot Directory ${OUTPUT DIR}${/}screenshots${/}notebook${/}${TEST NAME.replace(' ', '_')}
201206
Copy File examples${/}${file} ${OUTPUT DIR}${/}home${/}${file}
202-
Try to Close All Tabs
207+
Run Keyword If ${isolated} Try to Close All Tabs
203208
Open ${file} in ${MENU NOTEBOOK}
204-
Capture Page Screenshot 00-opened.png
209+
Capture Page Screenshot 00-notebook-opened.png
205210
Wait Until Fully Initialized
206-
Capture Page Screenshot 01-initialized.png
211+
Capture Page Screenshot 01-notebook-initialized.png
207212

208213
Open Diagnostics Panel
209214
Lab Command Show Diagnostics Panel

‎atest/Variables.robot

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ ${CMD PALETTE ITEM ACTIVE} css:#command-palette .lm-CommandPalette-item.lm-mo
1111
${JLAB XP TOP} //div[@id='jp-top-panel']
1212
${JLAB XP MENU ITEM LABEL} //div[@class='lm-Menu-itemLabel']
1313
${JLAB XP MENU LABEL} //div[@class='lm-MenuBar-itemLabel']
14+
${JLAB XP DOCK TAB} xpath://div[contains(@class, 'lm-DockPanel-tabBar')]//li[contains(@class, 'lm-TabBar-tab')]
1415
${JLAB CSS VERSION} css:.jp-About-version
1516
${CSS DIALOG OK} css:.jp-Dialog .jp-mod-accept
1617
${MENU OPEN WITH} xpath://div[contains(@class, 'lm-Menu-itemLabel')][contains(text(), "Open With")]
@@ -24,3 +25,9 @@ ${DIALOG WINDOW} css:.jp-Dialog
2425
${DIALOG INPUT} css:.jp-Input-Dialog input
2526
${DIALOG ACCEPT} css:button.jp-Dialog-button.jp-mod-accept
2627
${STATUSBAR} css:div.lsp-statusbar-item
28+
${MENU EDITOR} xpath://div[contains(@class, 'lm-Menu-itemLabel')][contains(., "Editor")]
29+
${MENU JUMP} xpath://div[contains(@class, 'lm-Menu-itemLabel')][contains(text(), "Jump to definition")]
30+
${MENU SETTINGS} xpath://div[contains(@class, 'lm-MenuBar-itemLabel')][contains(text(), "Settings")]
31+
${MENU EDITOR THEME} xpath://div[contains(@class, 'lm-Menu-itemLabel')][contains(text(), "Text Editor Theme")]
32+
${CM CURSOR} css:.CodeMirror-cursor
33+
${CM CURSORS} css:.CodeMirror-cursors:not([style='visibility: hidden'])

‎atest/examples/Diagnostic.ipynb

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
{
2+
"cells": [
3+
{
4+
"cell_type": "code",
5+
"execution_count": null,
6+
"metadata": {},
7+
"outputs": [],
8+
"source": [
9+
"# one `warning`, shows active line token highlighting\n",
10+
"from itertools import (accumulate, chain); accumulate\n",
11+
"\n",
12+
"# one `error`\n",
13+
"XXXXXXXXXX"
14+
]
15+
},
16+
{
17+
"cell_type": "code",
18+
"execution_count": null,
19+
"metadata": {},
20+
"outputs": [],
21+
"source": [
22+
"# one `warning`, shows active line token highlighting\n",
23+
"from itertools import (accumulate, chain); accumulate\n",
24+
"\n",
25+
"# one `error`\n",
26+
"XXXXXXXXXX"
27+
]
28+
},
29+
{
30+
"cell_type": "code",
31+
"execution_count": null,
32+
"metadata": {},
33+
"outputs": [],
34+
"source": [
35+
"%%R\n",
36+
"# one `information`\n",
37+
"test "
38+
]
39+
},
40+
{
41+
"cell_type": "code",
42+
"execution_count": null,
43+
"metadata": {},
44+
"outputs": [],
45+
"source": [
46+
"%%markdown\n",
47+
"# Foo\n",
48+
"# Foo\n",
49+
"above, one `hint`"
50+
]
51+
}
52+
],
53+
"metadata": {
54+
"kernelspec": {
55+
"display_name": "Python 3",
56+
"language": "python",
57+
"name": "python3"
58+
},
59+
"language_info": {
60+
"codemirror_mode": {
61+
"name": "ipython",
62+
"version": 3
63+
},
64+
"file_extension": ".py",
65+
"mimetype": "text/x-python",
66+
"name": "python",
67+
"nbconvert_exporter": "python",
68+
"pygments_lexer": "ipython3",
69+
"version": "3.7.6"
70+
}
71+
},
72+
"nbformat": 4,
73+
"nbformat_minor": 4
74+
}

‎atest/examples/example.py

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
'''Fibonacci accumulation'''
22

3-
from itertools import (accumulate, chain)
3+
from itertools import (accumulate, chain); accumulate
44

55

66
# fibs :: Integer :: [Integer]

‎atest/examples/style.py

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# one `warning`, shows active line token highlighting
2+
from itertools import accumulate; accumulate
3+
4+
# an extra token for highlighting
5+
accumulate
6+
7+
# one `error`, one `warning`
8+
foo + foo
9+
10+
# one `error`
11+
XXXXXXXXXXXXXX
12+
13+
# TODO: `hint`, `info`

‎docs/Architecture.ipynb

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,8 @@
1818
"import pathlib\n",
1919
"import re\n",
2020
"\n",
21-
"import IPython\n",
22-
"\n",
2321
"import graphviz\n",
22+
"import IPython\n",
2423
"\n",
2524
"\n",
2625
"@IPython.core.magic.register_line_cell_magic\n",

‎packages/jupyterlab-lsp/style/highlight.css

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
@import url('./variables/base.css');
2+
@import url('./variables/cm-themes.css');
3+
@import url('./variables/jupyterlab-dark.css');
4+
@import url('./variables/jupyterlab-light.css');
5+
6+
.cm-lsp-diagnostic {
7+
text-decoration-line: underline;
8+
/* For Chrome */
9+
text-decoration-skip-ink: none;
10+
}
11+
12+
.cm-lsp-diagnostic-Error {
13+
/*
14+
"wavy" would be ideal, but there seems to be a bug in Chrome which makes it
15+
fail to render the last character see:
16+
https://stackoverflow.com/questions/57559588/how-to-make-the-wavy-underline-extend-cover-all-the-characters-in-chrome
17+
an alternative would be to use background image trick to simulate the underline
18+
*/
19+
20+
text-decoration-style: var(
21+
--jp-editor-mirror-lsp-diagnostic-decoration-style
22+
);
23+
text-decoration-color: var(
24+
--jp-editor-mirror-lsp-diagnostic-error-decoration-color
25+
);
26+
}
27+
28+
.cm-lsp-diagnostic-Warning {
29+
text-decoration-style: var(
30+
--jp-editor-mirror-lsp-diagnostic-decoration-style
31+
);
32+
text-decoration-color: var(
33+
--jp-editor-mirror-lsp-diagnostic-warning-decoration-color
34+
);
35+
}
36+
37+
.cm-lsp-diagnostic-Information {
38+
text-decoration-style: var(
39+
--jp-editor-mirror-lsp-diagnostic-decoration-style
40+
);
41+
text-decoration-color: var(
42+
--jp-editor-mirror-lsp-diagnostic-information-decoration-color
43+
);
44+
}
45+
46+
.cm-lsp-diagnostic-Hint {
47+
text-decoration-style: var(
48+
--jp-editor-mirror-lsp-diagnostic-decoration-style
49+
);
50+
text-decoration-color: var(
51+
--jp-editor-mirror-lsp-diagnostic-hint-decoration-color
52+
);
53+
}
54+
55+
/* hover */
56+
.cm-lsp-hover-available {
57+
text-decoration: var(--jp-editor-mirror-lsp-hover-decoration-style);
58+
text-decoration-color: var(--jp-editor-mirror-lsp-hover-decoration-color);
59+
}
60+
61+
/* highlight */
62+
.cm-lsp-highlight {
63+
background-color: var(--jp-editor-mirror-lsp-highlight-background-color);
64+
}

0 commit comments

Comments
 (0)