diff --git a/src/components/displays/selfServe/SelfServeQuestionsStep.vue b/src/components/displays/selfServe/SelfServeQuestionsStep.vue
index bb5246be..74b22cb8 100644
--- a/src/components/displays/selfServe/SelfServeQuestionsStep.vue
+++ b/src/components/displays/selfServe/SelfServeQuestionsStep.vue
@@ -43,9 +43,10 @@ const emitAnswerQuestion = (questionId: number, value: boolean) => {
{{ $t("self_wash.loading_data") }}
@@ -72,4 +73,8 @@ const emitAnswerQuestion = (questionId: number, value: boolean) => {
.self-serve-questions-status-slot .notification {
width: 100%;
}
+
+.self-serve-questions-status-slot .notification.is-invisible {
+ visibility: hidden;
+}
diff --git a/tests/e2e/self-serve-wash.spec.js b/tests/e2e/self-serve-wash.spec.js
index 551915fe..7be026c9 100644
--- a/tests/e2e/self-serve-wash.spec.js
+++ b/tests/e2e/self-serve-wash.spec.js
@@ -983,6 +983,7 @@ test.describe("Self-serve wash", () => {
permissions: ["user"],
selfServe: true,
});
+ api.selfServe.answerResponseDelayMs = 1000;
const preview = api.selfServe.previewByKey["7:AB12345"];
const primaryQuestion = preview.questions[0];
const followUpQuestion = {
@@ -1016,7 +1017,29 @@ test.describe("Self-serve wash", () => {
.poll(async () => questionCards.evaluateAll((cards) => cards.map((card) => card.getAttribute("data-testid"))))
.toEqual(["self-serve-question-11", "self-serve-question-21"]);
- const firstQuestionBefore = await page.getByTestId("self-serve-question-11").boundingBox();
+ const firstQuestion = page.getByTestId("self-serve-question-11");
+ let stableQuestionBoxSamples = 0;
+ let previousQuestionBoxKey = "";
+ await expect
+ .poll(
+ async () => {
+ const [box, viewport] = await Promise.all([firstQuestion.boundingBox(), page.viewportSize()]);
+ if (!box || !viewport || box.x < 0 || box.x >= viewport.width / 2) {
+ stableQuestionBoxSamples = 0;
+ previousQuestionBoxKey = "";
+ return false;
+ }
+
+ const boxKey = [box.x, box.y, box.width, box.height].map((value) => Math.round(value)).join(":");
+ stableQuestionBoxSamples = boxKey === previousQuestionBoxKey ? stableQuestionBoxSamples + 1 : 0;
+ previousQuestionBoxKey = boxKey;
+ return stableQuestionBoxSamples >= 2;
+ },
+ { timeout: 10_000 }
+ )
+ .toBe(true);
+
+ const firstQuestionBefore = await firstQuestion.boundingBox();
expect(firstQuestionBefore).not.toBeNull();
const reorderedAnsweredQuestions = [{ ...followUpQuestion }, { ...primaryQuestion, answer: false }];
@@ -1036,7 +1059,7 @@ test.describe("Self-serve wash", () => {
await expect(noButton).toHaveClass(/is-danger/);
await expect(noButton).not.toHaveClass(/is-light/);
await expect(page.getByTestId("self-serve-questions-inline-loading")).toBeVisible();
- const firstQuestionWhileLoading = await page.getByTestId("self-serve-question-11").boundingBox();
+ const firstQuestionWhileLoading = await firstQuestion.boundingBox();
expect(firstQuestionWhileLoading).not.toBeNull();
expect(Math.abs((firstQuestionWhileLoading?.y || 0) - (firstQuestionBefore?.y || 0))).toBeLessThanOrEqual(4);