Skip to content

TS-45910: Azure DevOps extension: Dashboard widget only offers one project in dropdown #155

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
heinemann-cqse wants to merge 2 commits into
base: master
Choose a base branch
from
Open

TS-45910: Azure DevOps extension: Dashboard widget only offers one project in dropdown #155

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
9a6b29e
TS-45910: Azure DevOps extension: Dashboard widget only offers one pr…
heinemann-cqse May 6, 2026
1857847
TS-45910: Azure DevOps extension: Dashboard widget only offers one pr…
heinemann-cqse May 7, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 33 additions & 17 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 1 addition & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,10 +26,9 @@
"typescript": "^5.9.3"
},
"dependencies": {
"@types/chosen-js": "^1.8.6",
"chosen-js": "^1.8.7",
"jquery": "^4.0.0",
"jquery-ui-dist": "^1.13.3",
"tom-select": "^2.6.0",
"vss-web-extension-sdk": "^5.141.0"
},
"overrides": {
Expand Down
4 changes: 2 additions & 2 deletions sites/widget-configuration.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@
<script src="../lib/VSS.SDK.min.js"></script>
<script src="../lib/jquery.min.js"></script>
<script src="../lib/jquery-ui.min.js"></script>
<script src="../lib/chosen.jquery.min.js"></script>
<script src="../lib/tom-select.complete.min.js"></script>
<link rel="stylesheet" type="text/css" href="../styles/settings.css">
<link rel="stylesheet" type="text/css" href="../styles/jquery-ui.min.css">
<link rel="stylesheet" type="text/css" href="../styles/chosen.min.css">
<link rel="stylesheet" type="text/css" href="../styles/tom-select.default.min.css">
</head>
<body>
<div class="container">
Expand Down
76 changes: 37 additions & 39 deletions src/DashboardWidgetExtension/WidgetConfiguration.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,8 @@
import {ExtensionSetting} from "../Settings/ExtensionSetting";
import UiUtils = require('../Utils/UiUtils');

declare var TomSelect: any;

Check warning on line 17 in src/DashboardWidgetExtension/WidgetConfiguration.ts

View check run for this annotation

cqse.teamscale.io / Teamscale | Findings

src/DashboardWidgetExtension/WidgetConfiguration.ts#L17 

[New] `var` keyword should be `let` or `const` instead
https://cqse.teamscale.io/findings/details/teamscale-azure-devops-extension?id=ED0D101F9FD0A7D52203608562CC2E06&t=ts%2F45910_project_and_baseline_selector_not_working%3AHEAD

export class Configuration {
private projectSettings: ProjectSettings = null;
private organizationSettings: Settings = null;
Expand All @@ -34,6 +36,10 @@
private testGapCheckbox = $('#show-test-gap');
private separateTgaServerCheckbox = $('#separate-tga-server');

private tsProjectSelect: any;
private tsTgaProjectSelect: any;
private tsBaselineSelect: any;

private widgetHelpers: any;
private readonly notificationService: any;
private readonly controlService: any;
Expand Down Expand Up @@ -63,10 +69,15 @@
this.separateTgaServerCheckbox.prop('checked', this.widgetSettings.useSeparateTgaServer);
}
this.zipTgaConfiguration();
$('#teamscale-project-select').chosen({width: '100%'}).on('change',
() => this.fillDropdownWithTeamscaleBaselines(notifyWidgetChange));
$('#teamscale-tga-project-select').chosen({width: '100%'}).on('change', notifyWidgetChange);
$('#ts-baseline-select').chosen({width: '95%'}).on('change', notifyWidgetChange);

this.tsProjectSelect = new TomSelect('#teamscale-project-select', {});
this.tsProjectSelect.on('change', () => this.fillDropdownWithTeamscaleBaselines(notifyWidgetChange));

this.tsTgaProjectSelect = new TomSelect('#teamscale-tga-project-select', {});
this.tsTgaProjectSelect.on('change', notifyWidgetChange);

this.tsBaselineSelect = new TomSelect('#ts-baseline-select', {});
this.tsBaselineSelect.on('change', notifyWidgetChange);

this.loadAndCheckConfiguration().then(() => this.fillDropdownsWithProjects())
.then(() => this.fillDropdownWithTeamscaleBaselines(notifyWidgetChange))
Expand Down Expand Up @@ -129,12 +140,8 @@
}

private handleMissingTgaServerConfig() {
const element = document.createElement('option');
element.textContent = 'Error: No TGA server configured. Deactivate separate Server option or' +
' configure TGA Server.';
this.teamscaleTgaProjectSelect.appendChild(element);
$('#' + this.teamscaleTgaProjectSelect.id).prop('disabled', true);
$('#' + this.teamscaleTgaProjectSelect.id).trigger('chosen:updated');
this.tsTgaProjectSelect.addOption({value: '', text: 'Error: No TGA server configured. Deactivate separate Server option or configure TGA Server.'});
this.tsTgaProjectSelect.disable();
return Promise.resolve();
}

Expand All @@ -149,7 +156,7 @@
* Loads a list of accessible projects from the Teamscale server and appends them to the TQE dropdown menu.
*/
private async fillTqeDropdownWithProjects() {
return this.fillDropdownWithProjects(this.teamscaleClient, this.teamscaleProjectSelect, '#teamscale-project-select');
return this.fillDropdownWithProjects(this.teamscaleClient, this.tsProjectSelect, 'teamscaleProject');
}

/**
Expand All @@ -164,13 +171,13 @@
}
this.tgaTeamscaleClient = new TeamscaleClient(tgaUrl);
}
return this.fillDropdownWithProjects(this.tgaTeamscaleClient, this.teamscaleTgaProjectSelect, '#teamscale-tga-project-select');
return this.fillDropdownWithProjects(this.tgaTeamscaleClient, this.tsTgaProjectSelect, 'tgaTeamscaleProject');
}

/**
* Loads a list of accessible projects from the Teamscale server and appends them to the dropdown menu.
*/
private async fillDropdownWithProjects(teamscaleClient: TeamscaleClient, selectElement: HTMLSelectElement, selectElementId: string) {
private async fillDropdownWithProjects(teamscaleClient: TeamscaleClient, tomSelect: any, settingsKey: string) {
let projects: string[];
try {
projects = await teamscaleClient.retrieveTeamscaleProjects();
Expand All @@ -179,25 +186,22 @@
return Promise.reject(error);
}

tomSelect.clearOptions();
for (const project of projects) {
const element = document.createElement('option');
element.textContent = project;
element.value = project;
if (this.widgetSettings) {
element.selected = this.widgetSettings.teamscaleProject === project;
}
selectElement.appendChild(element);
tomSelect.addOption({value: project, text: project});
}

$(selectElementId).trigger('chosen:updated');
if (this.widgetSettings && this.widgetSettings[settingsKey]) {
tomSelect.setValue(this.widgetSettings[settingsKey], true);
}
}

/**
* Loads the list configured baselines for a project from the Teamscale server and appends them to the dropdown menu.
*/
private async fillDropdownWithTeamscaleBaselines(notifyWidgetChange) {
// use input value and not widgetSetting Object which might hold an outdated project name
// since the chosen change event of the project selector is fired before the settings object update
// since the change event of the project selector is fired before the settings object update
const teamscaleProject: string = this.teamscaleProjectSelect.value;

let baselines: ITeamscaleBaseline[];
Expand All @@ -209,26 +213,22 @@
return Promise.reject(error);
}

while (this.teamscaleBaselineSelect.firstChild) {
this.teamscaleBaselineSelect.removeChild(this.teamscaleBaselineSelect.firstChild);
}
this.tsBaselineSelect.clearOptions();

this.disableBaselineDropdownForProjectsWithoutBaselines(baselines, teamscaleProject);

for (const baseline of baselines) {
const element = document.createElement('option');
const date = new Date(baseline.timestamp);
element.textContent = baseline.name + ' (' + date.toLocaleDateString() + ')';
element.value = baseline.name;
if (this.widgetSettings) {
element.selected = this.widgetSettings.tsBaseline === baseline.name;
}
this.teamscaleBaselineSelect.appendChild(element);
const text = baseline.name + ' (' + date.toLocaleDateString() + ')';
this.tsBaselineSelect.addOption({value: baseline.name, text: text});
}

if (this.widgetSettings && this.widgetSettings.tsBaseline) {
this.tsBaselineSelect.setValue(this.widgetSettings.tsBaseline, true);
}

// update widget settings to get rid of a baseline which belongs to the formally chosen project
// update widget settings to get rid of a baseline which belongs to the formerly chosen project
this.getAndUpdateCustomSettings();
$('#ts-baseline-select').trigger('chosen:updated');
notifyWidgetChange();
}

Expand All @@ -237,12 +237,10 @@
*/
private disableBaselineDropdownForProjectsWithoutBaselines(baselines: ITeamscaleBaseline[], teamscaleProject: string) {
if (baselines.length === 0) {
const element = document.createElement('option');
element.textContent = 'No baseline configured for project »' + teamscaleProject + '«';
this.teamscaleBaselineSelect.appendChild(element);
$('#ts-baseline-select').prop('disabled', true);
this.tsBaselineSelect.addOption({value: '', text: 'No baseline configured for project »' + teamscaleProject + '«'});
this.tsBaselineSelect.disable();
} else {
$('#ts-baseline-select').prop('disabled', false);
this.tsBaselineSelect.enable();
}
}

Expand Down
3 changes: 1 addition & 2 deletions tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,7 @@
"rootDir": "src/",
"outDir": "dist/",
"types": [
"vss-web-extension-sdk",
"chosen-js"
"vss-web-extension-sdk"
],
"lib": [ "es2015", "dom" ]
}
Expand Down
13 changes: 4 additions & 9 deletions vss-extension.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -168,14 +168,14 @@
"packagePath": "lib/VSS.SDK.min.js"
},
{
"path": "node_modules/chosen-js/chosen.jquery.min.js",
"path": "node_modules/tom-select/dist/js/tom-select.complete.min.js",
"addressable": true,
"packagePath": "lib/chosen.jquery.min.js"
"packagePath": "lib/tom-select.complete.min.js"
},
{
"path": "node_modules/chosen-js/chosen.min.css",
"path": "node_modules/tom-select/dist/css/tom-select.default.min.css",
"addressable": true,
"packagePath": "styles/chosen.min.css"
"packagePath": "styles/tom-select.default.min.css"
},
{
"path": "node_modules/jquery/dist/jquery.min.js",
Expand All @@ -197,11 +197,6 @@
"addressable": true,
"packagePath": "styles/images/ui-icons_444444_256x240.png"
},
{
"path": "node_modules/chosen-js/chosen-sprite.png",
"addressable": true,
"packagePath": "styles/chosen-sprite.png"
},
{
"path": "scripts/require.js",
"addressable": true
Expand Down