Skip to content

🐛 [Frontend] Fix: Cropped Fontawesome images #7369

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.

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

Merged
merged 17 commits into from
Mar 17, 2025
Original file line number Diff line number Diff line change
Expand Up @@ -140,6 +140,7 @@ qx.Class.define("osparc.dashboard.GridButtonBase", {
const hGrid = new qx.ui.layout.Grid().set({
spacing: 6,
});
hGrid.setRowFlex(0, 1);
hGrid.setColumnFlex(1, 1);
hGrid.setColumnAlign(0, "right", "middle");
hGrid.setColumnAlign(1, "left", "middle");
Expand All @@ -149,6 +150,7 @@ qx.Class.define("osparc.dashboard.GridButtonBase", {
paddingBottom: 6,
paddingRight: 4,
maxWidth: this.self().ITEM_WIDTH,
minHeight: 32 + 6,
maxHeight: this.self().ITEM_HEIGHT
});
control.setLayout(hGrid);
Expand Down Expand Up @@ -283,18 +285,11 @@ qx.Class.define("osparc.dashboard.GridButtonBase", {

// overridden
_applyThumbnail: function(value, old) {
if (value.includes("@FontAwesome5Solid/")) {
if (qx.util.ResourceManager.getInstance().isFontUri(value)) {
value += this.self().THUMBNAIL_SIZE;
const image = this.getChildControl("thumbnail").set({
this.getChildControl("thumbnail").set({
source: value,
});

[
"appear",
"loaded"
].forEach(eventName => {
image.addListener(eventName, () => this.__fitThumbnailHeight(), this);
});
} else {
let source = osparc.product.Utils.getThumbnailUrl();
osparc.utils.Utils.checkImageExists(value)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ qx.Class.define("osparc.dashboard.ServiceBrowser", {
// overridden
initResources: function() {
this._resourcesList = [];
osparc.store.Services.getServicesLatest(false)
osparc.store.Services.getServicesLatest()
.then(services => {
// Show "Contact Us" message if services.length === 0
// Most probably is a product-stranger user (it can also be that the catalog is down)
Expand Down
149 changes: 76 additions & 73 deletions services/static-webserver/client/source/class/osparc/study/Utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -169,80 +169,83 @@ qx.Class.define("osparc.study.Utils", {

createStudyFromTemplate: function(templateData, loadingPage, contextProps = {}) {
return new Promise((resolve, reject) => {
const inaccessibleServices = osparc.store.Services.getInaccessibleServices(templateData["workbench"]);
if (inaccessibleServices.length) {
const msg = osparc.store.Services.getInaccessibleServicesMsg(inaccessibleServices, templateData["workbench"]);
reject({
message: msg
osparc.store.Services.getStudyServicesMetadata(templateData)
.finally(() => {
const inaccessibleServices = osparc.store.Services.getInaccessibleServices(templateData["workbench"]);
if (inaccessibleServices.length) {
const msg = osparc.store.Services.getInaccessibleServicesMsg(inaccessibleServices, templateData["workbench"]);
reject({
message: msg
});
return;
}
// context props, otherwise Study will be created in the root folder of my personal workspace
const minStudyData = Object.assign(osparc.data.model.Study.createMinStudyObject(), contextProps);
minStudyData["name"] = templateData["name"];
minStudyData["description"] = templateData["description"];
minStudyData["thumbnail"] = templateData["thumbnail"];
const params = {
url: {
templateId: templateData["uuid"]
},
data: minStudyData
};
const options = {
pollTask: true
};
const fetchPromise = osparc.data.Resources.fetch("studies", "postNewStudyFromTemplate", params, options);
const pollTasks = osparc.data.PollTasks.getInstance();
const interval = 1000;
pollTasks.createPollingTask(fetchPromise, interval)
.then(task => {
const title = qx.locale.Manager.tr("CREATING ") + osparc.product.Utils.getStudyAlias({allUpperCase: true}) + " ...";
const progressSequence = new osparc.widget.ProgressSequence(title).set({
minHeight: 180 // four tasks
});
progressSequence.addOverallProgressBar();
loadingPage.clearMessages();
loadingPage.addWidgetToMessages(progressSequence);
task.addListener("updateReceived", e => {
const updateData = e.getData();
if ("task_progress" in updateData && loadingPage) {
const progress = updateData["task_progress"];
const message = progress["message"];
const percent = progress["percent"] ? parseFloat(progress["percent"].toFixed(3)) : progress["percent"];
progressSequence.setOverallProgress(percent);
const existingTask = progressSequence.getTask(message);
if (existingTask) {
// update task
osparc.widget.ProgressSequence.updateTaskProgress(existingTask, {
value: percent,
progressLabel: parseFloat((percent*100).toFixed(2)) + "%"
});
} else {
// new task
// all the previous steps to 100%
progressSequence.getTasks().forEach(tsk => osparc.widget.ProgressSequence.updateTaskProgress(tsk, {
value: 1,
progressLabel: "100%"
}));
// and move to the next new task
const subTask = progressSequence.addNewTask(message);
osparc.widget.ProgressSequence.updateTaskProgress(subTask, {
value: percent,
progressLabel: "0%"
});
}
}
}, this);
task.addListener("resultReceived", e => {
const studyData = e.getData();
resolve(studyData);
}, this);
task.addListener("pollingError", e => {
const err = e.getData();
reject(err);
}, this);
})
.catch(err => reject(err));
});
return;
}
// context props, otherwise Study will be created in the root folder of my personal workspace
const minStudyData = Object.assign(osparc.data.model.Study.createMinStudyObject(), contextProps);
minStudyData["name"] = templateData["name"];
minStudyData["description"] = templateData["description"];
minStudyData["thumbnail"] = templateData["thumbnail"];
const params = {
url: {
templateId: templateData["uuid"]
},
data: minStudyData
};
const options = {
pollTask: true
};
const fetchPromise = osparc.data.Resources.fetch("studies", "postNewStudyFromTemplate", params, options);
const pollTasks = osparc.data.PollTasks.getInstance();
const interval = 1000;
pollTasks.createPollingTask(fetchPromise, interval)
.then(task => {
const title = qx.locale.Manager.tr("CREATING ") + osparc.product.Utils.getStudyAlias({allUpperCase: true}) + " ...";
const progressSequence = new osparc.widget.ProgressSequence(title).set({
minHeight: 180 // four tasks
});
progressSequence.addOverallProgressBar();
loadingPage.clearMessages();
loadingPage.addWidgetToMessages(progressSequence);
task.addListener("updateReceived", e => {
const updateData = e.getData();
if ("task_progress" in updateData && loadingPage) {
const progress = updateData["task_progress"];
const message = progress["message"];
const percent = progress["percent"] ? parseFloat(progress["percent"].toFixed(3)) : progress["percent"];
progressSequence.setOverallProgress(percent);
const existingTask = progressSequence.getTask(message);
if (existingTask) {
// update task
osparc.widget.ProgressSequence.updateTaskProgress(existingTask, {
value: percent,
progressLabel: parseFloat((percent*100).toFixed(2)) + "%"
});
} else {
// new task
// all the previous steps to 100%
progressSequence.getTasks().forEach(tsk => osparc.widget.ProgressSequence.updateTaskProgress(tsk, {
value: 1,
progressLabel: "100%"
}));
// and move to the next new task
const subTask = progressSequence.addNewTask(message);
osparc.widget.ProgressSequence.updateTaskProgress(subTask, {
value: percent,
progressLabel: "0%"
});
}
}
}, this);
task.addListener("resultReceived", e => {
const studyData = e.getData();
resolve(studyData);
}, this);
task.addListener("pollingError", e => {
const err = e.getData();
reject(err);
}, this);
})
.catch(err => reject(err));
});
},

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -247,7 +247,10 @@ qx.Class.define("osparc.workbench.ServiceCatalog", {
osparc.store.Services.populateVersionsSelectBox(key, selectBox)
.then(() => {
osparc.utils.Utils.growSelectBox(selectBox, 200);
selectBox.setSelection([latest]);
const idx = selectBox.getSelectables().indexOf(latest);
if (idx > -1) {
selectBox.setSelection([latest]);
}
});
}
}
Expand Down
2 changes: 1 addition & 1 deletion tests/e2e/jest.config.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
module.exports = {
preset: "jest-puppeteer",
verbose: true,
collectCoverage: true,
collectCoverage: false,
coverageReporters: ["lcov", "text"],
globals: {
url: "http://127.0.0.1.nip.io:9081/", // For local testing, set your deployed url here
Expand Down
75 changes: 75 additions & 0 deletions tests/e2e/tests/register.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
const auto = require('../utils/auto');
const utils = require('../utils/utils');


const {
user,
pass
} = utils.getUserAndPass();

module.exports = {
registerAndLogOut: () => {
describe('Register and LogOut', () => {
const firstHandler = async response => {
if (response.url().endsWith("/config")) {
try {
const respStatus = response.status();
expect(respStatus).toBe(200);
const responseBody = await response.json();
expect(responseBody.data["invitation_required"]).toBeFalsy();
} catch (e) {
console.log("Puppeteer error", e);
}
} else if (response.url().endsWith("/register")) {
try {
const respStatus = response.status();
expect(respStatus).toBe(200);
} catch (e) {
console.log("Puppeteer error", e);
}
}
}

const secondHandler = response => {
if (response.url().endsWith("/login")) {
try {
const respStatus = response.status();
expect(respStatus).toBe(200);
} catch (e) {
console.log("Puppeteer error", e);
}
} else if (response.url().endsWith("/me")) {
try {
const respStatus = response.status();
expect(respStatus).toBe(200);
} catch (e) {
console.log("Puppeteer error", e);
}
} else if (response.url().endsWith("/logout")) {
expect(response.status()).toBe(200);
}
}

beforeAll(async () => {
console.log("Start:", new Date().toUTCString());

await page.goto(url);
}, ourTimeout);

afterAll(async () => {
page.off('response', firstHandler);
page.off('response', secondHandler);

console.log("End:", new Date().toUTCString());
})

test('Register and Log Out', async () => {
page.on('response', firstHandler);
await auto.register(page, user, pass);
page.on('response', secondHandler);
await auto.logOut(page);
await page.waitFor(5000);
}, ourTimeout);
});
}
}
71 changes: 0 additions & 71 deletions tests/e2e/tests/register.test.js

This file was deleted.

Loading
Loading