Skip to content

Commit b959eef

Browse files
andrewrobinsonhodges-snykandrewrobinsonhodges-snyk
authored
feat: add option to use new html settings page served from language server [IDE-1457] (#345)
* feat: render settings page served from language server * feat: project plugin settings direct user to main settings * fix: code review markups, add CSS styling to config html * fix: settings html styling updates * refactor: tidy up html replacement * refactor: remove unused code * fix: pmd errors * test: add tests for new html settings * test: update test to reflect new settings default * fix: include severity filters in LS settings * fix: update html callback method names * fix: changing issue filtering in html settings updates filters in menus * feat: add insecure option to fallback html settings * refactor: move ssl check to base url field in settings fallback * fix: loading message should be styled the same as the settings page * fix: handle null display in tests * refactor: change html indendation for settings fallback * chore: add ci check to keep settings-fallback html in sync across ide repos * chore: update changelog * fix: don't call overridable methods in settings page constructors * refactor: remove unused code for settings prefs regarding html settings page use. * test: update tests to match new logic * fix: change visibility of utility method for tests * refactor: pull css variable names out into vars * refactor: simplify html loading logic * refactor: simplify html loading logic * fix: disable html settings page by default * update changelog to reflect new behaviour of settings page
1 parent 0843c78 commit b959eef

24 files changed

+1872
-364
lines changed

‎.github/workflows/resource-check.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ jobs:
1717
# Add each resource as a key, value pair, mapping the local resource to the reference file (which should be stored in the language server repository). For example:
1818
# resources["<path_to_local_file>"]="<url_of_reference_file>"
1919
resources["plugin/src/main/resources/ui/html/ScanSummaryInit.html"]="https://raw.githubusercontent.com/snyk/snyk-ls/refs/heads/main/shared_ide_resources/ui/html/ScanSummaryInit.html"
20+
resources["plugin/src/main/resources/ui/html/settings-fallback.html"]="https://raw.githubusercontent.com/snyk/snyk-ls/refs/heads/main/shared_ide_resources/ui/html/settings-fallback.html"
2021
for key in ${!resources[@]}; do
2122
candidate=$(sha512sum $key | awk {'print $1'})
2223
candidate=${candidate:="null"}

‎CHANGELOG.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
# Snyk Security Changelog
22

3+
## [3.7.0]
4+
### Changes
5+
- Added support for improved Settings UI for simpler configuration of Snyk settings. Enable by setting the environment variable SNYK_USE_HTML_SETTINGS to true.
6+
37
## [3.6.0]
48
### Changes
59
- Add setting organization configuration at the project level.

‎plugin/plugin.xml‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
</extension>
3535
<extension point="org.eclipse.ui.preferencePages">
3636
<page
37-
class="io.snyk.eclipse.plugin.preferences.PreferencesPage"
37+
class="io.snyk.eclipse.plugin.preferences.SnykPreferencePageFactory"
3838
id="io.snyk.eclipse.plugin.properties.preferencespage"
3939
name="%page.name">
4040
</page>
@@ -504,7 +504,7 @@
504504
</extension>
505505
<extension point="org.eclipse.ui.propertyPages">
506506
<page
507-
class="io.snyk.eclipse.plugin.properties.ProjectPropertyPage"
507+
class="io.snyk.eclipse.plugin.properties.ProjectPropertyPageFactory"
508508
icon="icons/patch.png"
509509
id="io.snyk.eclipse.plugin.properties.projectPropertyPage"
510510
name="Snyk">

‎plugin/src/main/java/io/snyk/eclipse/plugin/html/BaseHtmlProvider.java‎

Lines changed: 131 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,67 @@ public class BaseHtmlProvider {
2424
private final Random random = new Random();
2525
private final Map<String, String> colorCache = new HashMap<>();
2626
private String nonce = "";
27+
28+
// Suffix used to neutralize VSCode CSS variable fallbacks (e.g., "var(--vscode-foo, fallback)")
29+
// We replace "var(--vscode-foo," with "value; --unused:" so the fallback becomes a no-op property
30+
private static final String VSCODE_VAR_SUFFIX = "; --unused:";
31+
32+
// Eclipse theme color keys
33+
private static final String THEME_INACTIVE_TAB_BG = "org.eclipse.ui.workbench.INACTIVE_TAB_BG_START";
34+
private static final String THEME_ACTIVE_TAB_KEYLINE = "org.eclipse.ui.workbench.ACTIVE_TAB_OUTER_KEYLINE_COLOR";
35+
private static final String THEME_ACTIVE_TAB_SELECTED_TEXT = "org.eclipse.ui.workbench.ACTIVE_TAB_SELECTED_TEXT_COLOR";
36+
private static final String THEME_ACTIVE_TAB_TEXT = "org.eclipse.ui.workbench.ACTIVE_TAB_TEXT_COLOR";
37+
private static final String THEME_ACTIVE_NOFOCUS_TAB_BG = "org.eclipse.ui.workbench.ACTIVE_NOFOCUS_TAB_BG_START";
38+
private static final String THEME_ACTIVE_TAB_BG_END = "org.eclipse.ui.workbench.ACTIVE_TAB_BG_END";
39+
private static final String THEME_ACTIVE_HYPERLINK = "ACTIVE_HYPERLINK_COLOR";
40+
private static final String THEME_DARK_BACKGROUND = "org.eclipse.ui.workbench.DARK_BACKGROUND";
41+
42+
private static final String CSS_VAR_DEFAULT_FONT = "var(--default-font)";
43+
private static final String CSS_VAR_MAIN_FONT_SIZE = "var(--main-font-size)";
44+
private static final String CSS_VAR_TEXT_COLOR = "var(--text-color)";
45+
private static final String CSS_VAR_DIMMED_TEXT_COLOR = "var(--dimmed-text-color)";
46+
private static final String CSS_VAR_IDE_BACKGROUND_COLOR = "var(--ide-background-color)";
47+
private static final String CSS_VAR_BACKGROUND_COLOR = "var(--background-color)";
48+
private static final String CSS_VAR_CODE_BACKGROUND_COLOR = "var(--code-background-color)";
49+
private static final String CSS_VAR_BUTTON_COLOR = "var(--button-color)";
50+
private static final String CSS_VAR_CIRCLE_COLOR = "var(--circle-color)";
51+
private static final String CSS_VAR_BORDER_COLOR = "var(--border-color)";
52+
private static final String CSS_VAR_INPUT_BORDER = "var(--input-border)";
53+
private static final String CSS_VAR_LINK_COLOR = "var(--link-color)";
54+
private static final String CSS_VAR_HORIZONTAL_BORDER_COLOR = "var(--horizontal-border-color)";
55+
private static final String CSS_VAR_SECTION_BACKGROUND_COLOR = "var(--section-background-color)";
56+
private static final String CSS_VAR_INPUT_BACKGROUND_COLOR = "var(--input-background-color)";
57+
private static final String CSS_VAR_FOCUS_COLOR = "var(--focus-color)";
58+
59+
private static final String VSCODE_VAR_FONT_FAMILY_PREFIX = "var(--vscode-font-family,";
60+
private static final String VSCODE_VAR_EDITOR_FONT_FAMILY_PREFIX = "var(--vscode-editor-font-family,";
61+
private static final String VSCODE_VAR_FONT_SIZE_PREFIX = "var(--vscode-font-size,";
62+
private static final String VSCODE_VAR_EDITOR_BACKGROUND_PREFIX = "var(--vscode-editor-background,";
63+
private static final String VSCODE_VAR_FOREGROUND_PREFIX = "var(--vscode-foreground,";
64+
private static final String VSCODE_VAR_INPUT_FOREGROUND_PREFIX = "var(--vscode-input-foreground,";
65+
private static final String VSCODE_VAR_EDITOR_FOREGROUND_PREFIX = "var(--vscode-editor-foreground,";
66+
private static final String VSCODE_VAR_DISABLED_FOREGROUND_PREFIX = "var(--vscode-disabledForeground,";
67+
private static final String VSCODE_VAR_ERROR_FOREGROUND_PREFIX = "var(--vscode-errorForeground,";
68+
private static final String VSCODE_VAR_INPUT_BACKGROUND_PREFIX = "var(--vscode-input-background,";
69+
private static final String VSCODE_VAR_EDITOR_INACTIVE_SELECTION_BG_PREFIX = "var(--vscode-editor-inactiveSelectionBackground,";
70+
private static final String VSCODE_VAR_BUTTON_BACKGROUND_PREFIX = "var(--vscode-button-background,";
71+
private static final String VSCODE_VAR_BUTTON_FOREGROUND_PREFIX = "var(--vscode-button-foreground,";
72+
private static final String VSCODE_VAR_BUTTON_HOVER_BG_PREFIX = "var(--vscode-button-hoverBackground,";
73+
private static final String VSCODE_VAR_BUTTON_SECONDARY_BG_PREFIX = "var(--vscode-button-secondaryBackground,";
74+
private static final String VSCODE_VAR_BUTTON_SECONDARY_FOREGROUND_PREFIX = "var(--vscode-button-secondaryForeground,";
75+
private static final String VSCODE_VAR_BUTTON_SECONDARY_HOVER_BG_PREFIX = "var(--vscode-button-secondaryHoverBackground,";
76+
private static final String VSCODE_VAR_LIST_HOVER_BG_PREFIX = "var(--vscode-list-hoverBackground,";
77+
private static final String VSCODE_VAR_INPUT_BORDER_PREFIX = "var(--vscode-input-border,";
78+
private static final String VSCODE_VAR_PANEL_BORDER_PREFIX = "var(--vscode-panel-border,";
79+
private static final String VSCODE_VAR_FOCUS_BORDER_PREFIX = "var(--vscode-focusBorder,";
80+
private static final String VSCODE_VAR_SCROLLBAR_SLIDER_BG_PREFIX = "var(--vscode-scrollbarSlider-background,";
81+
private static final String VSCODE_VAR_SCROLLBAR_SLIDER_HOVER_BG_PREFIX = "var(--vscode-scrollbarSlider-hoverBackground,";
82+
private static final String VSCODE_VAR_SCROLLBAR_SLIDER_ACTIVE_BG_PREFIX = "var(--vscode-scrollbarSlider-activeBackground,";
83+
84+
// Default fallback colors
85+
private static final String DEFAULT_SECTION_BG_COLOR = "#F0F0F0";
86+
private static final String DEFAULT_BORDER_COLOR = "#CCCCCC";
87+
2788
public String getCss() {
2889
return "";
2990
}
@@ -98,38 +159,83 @@ public String getNoDescriptionHtml() {
98159
}
99160

100161
public String replaceCssVariables(String html) {
162+
return replaceCssVariables(html, true);
163+
}
164+
165+
public String replaceCssVariables(String html, boolean useRelativeFontSize) {
101166
// Build the CSS with the nonce
102167
String nonce = getNonce();
103168
String css = "<style nonce=\"" + nonce + "\">" + getCss() + "</style>";
104169
String htmlStyled = html.replace("${ideStyle}", css);
105170
htmlStyled = htmlStyled.replace("<style nonce=\"ideNonce\" data-ide-style></style>", css);
106-
htmlStyled = htmlStyled.replace("var(--default-font)",
171+
htmlStyled = htmlStyled.replace(CSS_VAR_DEFAULT_FONT,
107172
" ui-sans-serif, \"SF Pro Text\", \"Segoe UI\", \"Ubuntu\", Tahoma, Geneva, Verdana, sans-serif;");
108-
htmlStyled = htmlStyled.replace("var(--main-font-size)", getRelativeFontSize(getDefaultFontSize()));
173+
if (useRelativeFontSize) {
174+
htmlStyled = htmlStyled.replace(CSS_VAR_MAIN_FONT_SIZE, getRelativeFontSize(getDefaultFontSize()));
175+
} else {
176+
htmlStyled = htmlStyled.replace(CSS_VAR_MAIN_FONT_SIZE, "13px");
177+
}
109178

110179
// Replace CSS variables with actual color values
111-
htmlStyled = htmlStyled.replace("var(--text-color)",
112-
getColorAsHex("org.eclipse.ui.workbench.ACTIVE_TAB_SELECTED_TEXT_COLOR", "#000000"));
113-
htmlStyled = htmlStyled.replace("var(--dimmed-text-color)",
114-
getColorAsHex("org.eclipse.ui.workbench.ACTIVE_TAB_TEXT_COLOR", "#4F5456"));
115-
116-
htmlStyled = htmlStyled.replace("var(--ide-background-color)",
117-
getColorAsHex("org.eclipse.ui.workbench.ACTIVE_NOFOCUS_TAB_BG_START", "#FFFFFF"));
118-
htmlStyled = htmlStyled.replace("var(--background-color)",
119-
getColorAsHex("org.eclipse.ui.workbench.ACTIVE_TAB_BG_END", "#FFFFFF"));
120-
htmlStyled = htmlStyled.replace("var(--code-background-color)",
121-
getColorAsHex("org.eclipse.ui.workbench.INACTIVE_TAB_BG_START", "#F0F0F0"));
122-
htmlStyled = htmlStyled.replace("var(--button-color)",
123-
getColorAsHex("org.eclipse.ui.workbench.INACTIVE_TAB_BG_START", "#F0F0F0"));
124-
htmlStyled = htmlStyled.replace("var(--circle-color)",
125-
getColorAsHex("org.eclipse.ui.workbench.INACTIVE_TAB_BG_START", "#F0F0F0"));
126-
htmlStyled = htmlStyled.replace("var(--border-color)",
127-
getColorAsHex("org.eclipse.ui.workbench.ACTIVE_TAB_OUTER_KEYLINE_COLOR", "#CCCCCC"));
128-
htmlStyled = htmlStyled.replace("var(--input-border)",
129-
getColorAsHex("org.eclipse.ui.workbench.ACTIVE_TAB_OUTER_KEYLINE_COLOR", "#CCCCCC"));
130-
htmlStyled = htmlStyled.replace("var(--link-color)", getColorAsHex("ACTIVE_HYPERLINK_COLOR", "#0000FF"));
131-
htmlStyled = htmlStyled.replace("var(--horizontal-border-color)",
132-
getColorAsHex("org.eclipse.ui.workbench.ACTIVE_TAB_OUTER_KEYLINE_COLOR", "#CCCCCC"));
180+
htmlStyled = htmlStyled.replace(CSS_VAR_TEXT_COLOR, getColorAsHex(THEME_ACTIVE_TAB_SELECTED_TEXT, "#000000"));
181+
htmlStyled = htmlStyled.replace(CSS_VAR_DIMMED_TEXT_COLOR, getColorAsHex(THEME_ACTIVE_TAB_TEXT, "#4F5456"));
182+
183+
htmlStyled = htmlStyled.replace(CSS_VAR_IDE_BACKGROUND_COLOR, getColorAsHex(THEME_ACTIVE_NOFOCUS_TAB_BG, "#FFFFFF"));
184+
htmlStyled = htmlStyled.replace(CSS_VAR_BACKGROUND_COLOR, getColorAsHex(THEME_ACTIVE_TAB_BG_END, "#FFFFFF"));
185+
htmlStyled = htmlStyled.replace(CSS_VAR_CODE_BACKGROUND_COLOR,
186+
getColorAsHex(THEME_INACTIVE_TAB_BG, DEFAULT_SECTION_BG_COLOR));
187+
htmlStyled = htmlStyled.replace(CSS_VAR_BUTTON_COLOR,
188+
getColorAsHex(THEME_INACTIVE_TAB_BG, DEFAULT_SECTION_BG_COLOR));
189+
htmlStyled = htmlStyled.replace(CSS_VAR_CIRCLE_COLOR,
190+
getColorAsHex(THEME_INACTIVE_TAB_BG, DEFAULT_SECTION_BG_COLOR));
191+
htmlStyled = htmlStyled.replace(CSS_VAR_BORDER_COLOR,
192+
getColorAsHex(THEME_ACTIVE_TAB_KEYLINE, DEFAULT_BORDER_COLOR));
193+
htmlStyled = htmlStyled.replace(CSS_VAR_INPUT_BORDER,
194+
getColorAsHex(THEME_ACTIVE_TAB_KEYLINE, DEFAULT_BORDER_COLOR));
195+
htmlStyled = htmlStyled.replace(CSS_VAR_LINK_COLOR, getColorAsHex(THEME_ACTIVE_HYPERLINK, "#0000FF"));
196+
htmlStyled = htmlStyled.replace(CSS_VAR_HORIZONTAL_BORDER_COLOR,
197+
getColorAsHex(THEME_ACTIVE_TAB_KEYLINE, DEFAULT_BORDER_COLOR));
198+
199+
// Additional variables for fallback HTML
200+
htmlStyled = htmlStyled.replace(CSS_VAR_SECTION_BACKGROUND_COLOR,
201+
getColorAsHex(THEME_INACTIVE_TAB_BG, DEFAULT_SECTION_BG_COLOR));
202+
htmlStyled = htmlStyled.replace(CSS_VAR_INPUT_BACKGROUND_COLOR,
203+
getColorAsHex(THEME_INACTIVE_TAB_BG, DEFAULT_SECTION_BG_COLOR));
204+
htmlStyled = htmlStyled.replace(CSS_VAR_FOCUS_COLOR, getColorAsHex(THEME_ACTIVE_HYPERLINK, "#0000FF"));
205+
206+
// Replace VSCode CSS variables used in LS-served HTML (settings page)
207+
String textColor = getColorAsHex(THEME_ACTIVE_TAB_SELECTED_TEXT, "#000000");
208+
String bgColor = getColorAsHex(THEME_ACTIVE_TAB_BG_END, "#FFFFFF");
209+
String inputBgColor = getColorAsHex(THEME_INACTIVE_TAB_BG, DEFAULT_SECTION_BG_COLOR);
210+
String borderColor = getColorAsHex(THEME_ACTIVE_TAB_KEYLINE, DEFAULT_BORDER_COLOR);
211+
String focusColor = getColorAsHex(THEME_ACTIVE_HYPERLINK, "#0000FF");
212+
String buttonBgColor = getColorAsHex(THEME_INACTIVE_TAB_BG, DEFAULT_SECTION_BG_COLOR);
213+
String sectionBgColor = getColorAsHex(THEME_INACTIVE_TAB_BG, DEFAULT_SECTION_BG_COLOR);
214+
215+
htmlStyled = htmlStyled.replace(VSCODE_VAR_FONT_FAMILY_PREFIX, textColor + VSCODE_VAR_SUFFIX);
216+
htmlStyled = htmlStyled.replace(VSCODE_VAR_EDITOR_FONT_FAMILY_PREFIX, textColor + VSCODE_VAR_SUFFIX);
217+
htmlStyled = htmlStyled.replace(VSCODE_VAR_FONT_SIZE_PREFIX, "13px" + VSCODE_VAR_SUFFIX);
218+
htmlStyled = htmlStyled.replace(VSCODE_VAR_EDITOR_BACKGROUND_PREFIX, bgColor + VSCODE_VAR_SUFFIX);
219+
htmlStyled = htmlStyled.replace(VSCODE_VAR_FOREGROUND_PREFIX, textColor + VSCODE_VAR_SUFFIX);
220+
htmlStyled = htmlStyled.replace(VSCODE_VAR_INPUT_FOREGROUND_PREFIX, textColor + VSCODE_VAR_SUFFIX);
221+
htmlStyled = htmlStyled.replace(VSCODE_VAR_EDITOR_FOREGROUND_PREFIX, textColor + VSCODE_VAR_SUFFIX);
222+
htmlStyled = htmlStyled.replace(VSCODE_VAR_DISABLED_FOREGROUND_PREFIX, "#808080" + VSCODE_VAR_SUFFIX);
223+
htmlStyled = htmlStyled.replace(VSCODE_VAR_ERROR_FOREGROUND_PREFIX, "#f48771" + VSCODE_VAR_SUFFIX);
224+
htmlStyled = htmlStyled.replace(VSCODE_VAR_INPUT_BACKGROUND_PREFIX, inputBgColor + VSCODE_VAR_SUFFIX);
225+
htmlStyled = htmlStyled.replace(VSCODE_VAR_EDITOR_INACTIVE_SELECTION_BG_PREFIX, sectionBgColor + VSCODE_VAR_SUFFIX);
226+
htmlStyled = htmlStyled.replace(VSCODE_VAR_BUTTON_BACKGROUND_PREFIX, buttonBgColor + VSCODE_VAR_SUFFIX);
227+
htmlStyled = htmlStyled.replace(VSCODE_VAR_BUTTON_FOREGROUND_PREFIX, textColor + VSCODE_VAR_SUFFIX);
228+
htmlStyled = htmlStyled.replace(VSCODE_VAR_BUTTON_HOVER_BG_PREFIX, buttonBgColor + VSCODE_VAR_SUFFIX);
229+
htmlStyled = htmlStyled.replace(VSCODE_VAR_BUTTON_SECONDARY_BG_PREFIX, buttonBgColor + VSCODE_VAR_SUFFIX);
230+
htmlStyled = htmlStyled.replace(VSCODE_VAR_BUTTON_SECONDARY_FOREGROUND_PREFIX, textColor + VSCODE_VAR_SUFFIX);
231+
htmlStyled = htmlStyled.replace(VSCODE_VAR_BUTTON_SECONDARY_HOVER_BG_PREFIX, buttonBgColor + VSCODE_VAR_SUFFIX);
232+
htmlStyled = htmlStyled.replace(VSCODE_VAR_LIST_HOVER_BG_PREFIX, sectionBgColor + VSCODE_VAR_SUFFIX);
233+
htmlStyled = htmlStyled.replace(VSCODE_VAR_INPUT_BORDER_PREFIX, borderColor + VSCODE_VAR_SUFFIX);
234+
htmlStyled = htmlStyled.replace(VSCODE_VAR_PANEL_BORDER_PREFIX, borderColor + VSCODE_VAR_SUFFIX);
235+
htmlStyled = htmlStyled.replace(VSCODE_VAR_FOCUS_BORDER_PREFIX, focusColor + VSCODE_VAR_SUFFIX);
236+
htmlStyled = htmlStyled.replace(VSCODE_VAR_SCROLLBAR_SLIDER_BG_PREFIX, inputBgColor + VSCODE_VAR_SUFFIX);
237+
htmlStyled = htmlStyled.replace(VSCODE_VAR_SCROLLBAR_SLIDER_HOVER_BG_PREFIX, inputBgColor + VSCODE_VAR_SUFFIX);
238+
htmlStyled = htmlStyled.replace(VSCODE_VAR_SCROLLBAR_SLIDER_ACTIVE_BG_PREFIX, inputBgColor + VSCODE_VAR_SUFFIX);
133239

134240
htmlStyled = htmlStyled.replace("${headerEnd}", "");
135241
htmlStyled = htmlStyled.replace("${nonce}", nonce);
@@ -182,7 +288,7 @@ public String getColorAsHex(String colorKey, String defaultColor) {
182288
}
183289

184290
public Boolean isDarkTheme() {
185-
var darkColor = getColorAsHex("org.eclipse.ui.workbench.DARK_BACKGROUND", "");
291+
var darkColor = getColorAsHex(THEME_DARK_BACKGROUND, "");
186292
return Boolean.valueOf(darkColor);
187293
}
188294

0 commit comments

Comments
 (0)