Line 0
Link Here
|
|
|
1 |
import { |
2 |
edifactTestData, |
3 |
testDataUtils, |
4 |
} from "../../fixtures/edifact_test_data.js"; |
5 |
|
6 |
describe("EDIFACT Focus and Highlighting Tests", () => { |
7 |
let edifact_test_data = null; |
8 |
|
9 |
before(() => { |
10 |
// Insert test EDIFACT messages into the database |
11 |
cy.task("insertSampleEdifactMessages").then(test_data => { |
12 |
edifact_test_data = test_data; |
13 |
}); |
14 |
}); |
15 |
|
16 |
after(() => { |
17 |
// Clean up test data |
18 |
if (edifact_test_data) { |
19 |
cy.task("deleteSampleEdifactMessages", edifact_test_data); |
20 |
} |
21 |
}); |
22 |
|
23 |
beforeEach(() => { |
24 |
cy.login(); |
25 |
cy.title().should("eq", "Koha staff interface"); |
26 |
cy.visit("/cgi-bin/koha/acqui/edifactmsgs.pl"); |
27 |
}); |
28 |
|
29 |
describe("Focus Options Support", () => { |
30 |
it("should support basketno focus parameter", () => { |
31 |
// Mock EDIFACT response with basketno data |
32 |
cy.intercept( |
33 |
"GET", |
34 |
"**/edimsg.pl*", |
35 |
testDataUtils.createMockResponse( |
36 |
testDataUtils.getFocusData("basketno", "12345") |
37 |
) |
38 |
).as("basketResponse"); |
39 |
|
40 |
// Create a button with basketno data |
41 |
cy.document().then(doc => { |
42 |
const button = doc.createElement("button"); |
43 |
button.className = "view_edifact_message test-button"; |
44 |
button.setAttribute("data-message-id", "1"); |
45 |
button.setAttribute("data-basketno", "12345"); |
46 |
button.textContent = "View"; |
47 |
doc.body.appendChild(button); |
48 |
}); |
49 |
|
50 |
cy.get(".view_edifact_message").last().click(); |
51 |
|
52 |
cy.wait("@basketResponse"); |
53 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
54 |
}); |
55 |
|
56 |
it("should support basketname focus parameter", () => { |
57 |
// Mock EDIFACT response with basketname data |
58 |
cy.intercept( |
59 |
"GET", |
60 |
"**/edimsg.pl*", |
61 |
testDataUtils.createMockResponse( |
62 |
testDataUtils.getFocusData("basketname", "TestBasket001") |
63 |
) |
64 |
).as("basketnameResponse"); |
65 |
|
66 |
// Create a button with basketname data |
67 |
cy.document().then(doc => { |
68 |
const button = doc.createElement("button"); |
69 |
button.className = "view_edifact_message test-button"; |
70 |
button.setAttribute("data-message-id", "1"); |
71 |
button.setAttribute("data-basketname", "TestBasket001"); |
72 |
button.textContent = "View"; |
73 |
doc.body.appendChild(button); |
74 |
}); |
75 |
|
76 |
cy.get(".view_edifact_message").last().click(); |
77 |
|
78 |
cy.wait("@basketnameResponse"); |
79 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
80 |
}); |
81 |
|
82 |
it("should support invoicenumber focus parameter", () => { |
83 |
// Mock EDIFACT response with invoice data |
84 |
cy.intercept( |
85 |
"GET", |
86 |
"**/edimsg.pl*", |
87 |
testDataUtils.createMockResponse( |
88 |
testDataUtils.getFocusData( |
89 |
"invoicenumber", |
90 |
"TEST_INVOICE_001" |
91 |
) |
92 |
) |
93 |
).as("invoiceResponse"); |
94 |
|
95 |
// Create a button with invoice data |
96 |
cy.document().then(doc => { |
97 |
const button = doc.createElement("button"); |
98 |
button.className = "view_edifact_message test-button"; |
99 |
button.setAttribute("data-message-id", "1"); |
100 |
button.setAttribute("data-invoicenumber", "TEST_INVOICE_001"); |
101 |
button.textContent = "View"; |
102 |
doc.body.appendChild(button); |
103 |
}); |
104 |
|
105 |
cy.get(".view_edifact_message").last().click(); |
106 |
|
107 |
cy.wait("@invoiceResponse"); |
108 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
109 |
}); |
110 |
}); |
111 |
|
112 |
describe("Message Focus and Highlighting", () => { |
113 |
beforeEach(() => { |
114 |
// Mock EDIFACT response with multiple messages |
115 |
cy.intercept( |
116 |
"GET", |
117 |
"**/edimsg.pl*", |
118 |
testDataUtils.createMockResponse(edifactTestData.focusTestData) |
119 |
).as("multiMessageResponse"); |
120 |
}); |
121 |
|
122 |
it("should highlight focused message with visual styling", () => { |
123 |
// Create a button with basketname focus |
124 |
cy.document().then(doc => { |
125 |
const button = doc.createElement("button"); |
126 |
button.className = "view_edifact_message test-button"; |
127 |
button.setAttribute("data-message-id", "1"); |
128 |
button.setAttribute("data-basketname", "TestBasket001"); |
129 |
button.textContent = "View"; |
130 |
doc.body.appendChild(button); |
131 |
}); |
132 |
|
133 |
cy.get(".view_edifact_message").last().click(); |
134 |
|
135 |
cy.wait("@multiMessageResponse"); |
136 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
137 |
|
138 |
// Check that focused message has special styling |
139 |
cy.get('#EDI_modal [data-focus-message="true"]').should("exist"); |
140 |
cy.get("#EDI_modal .edi-focused-message").should("exist"); |
141 |
}); |
142 |
|
143 |
it("should scroll to focused message automatically", () => { |
144 |
// Create a button with basketname focus |
145 |
cy.document().then(doc => { |
146 |
const button = doc.createElement("button"); |
147 |
button.className = "view_edifact_message test-button"; |
148 |
button.setAttribute("data-message-id", "1"); |
149 |
button.setAttribute("data-basketname", "TestBasket001"); |
150 |
button.textContent = "View"; |
151 |
doc.body.appendChild(button); |
152 |
}); |
153 |
|
154 |
cy.get(".view_edifact_message").last().click(); |
155 |
|
156 |
cy.wait("@multiMessageResponse"); |
157 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
158 |
|
159 |
// Wait for scroll animation to complete |
160 |
cy.wait(1000); |
161 |
|
162 |
// Check that focused message is visible in viewport |
163 |
cy.get('#EDI_modal [data-focus-message="true"]').should( |
164 |
"be.visible" |
165 |
); |
166 |
}); |
167 |
|
168 |
it("should expand focused message automatically", () => { |
169 |
// Create a button with basketname focus |
170 |
cy.document().then(doc => { |
171 |
const button = doc.createElement("button"); |
172 |
button.className = "view_edifact_message test-button"; |
173 |
button.setAttribute("data-message-id", "1"); |
174 |
button.setAttribute("data-basketname", "TestBasket001"); |
175 |
button.textContent = "View"; |
176 |
doc.body.appendChild(button); |
177 |
}); |
178 |
|
179 |
cy.get(".view_edifact_message").last().click(); |
180 |
|
181 |
cy.wait("@multiMessageResponse"); |
182 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
183 |
|
184 |
// Check that focused message sections are expanded |
185 |
cy.get('#EDI_modal [data-focus-message="true"]').within(() => { |
186 |
cy.get(".collapse").should("have.class", "show"); |
187 |
}); |
188 |
}); |
189 |
|
190 |
it("should handle focus fallback when no matching message found", () => { |
191 |
// Create a button with basketname that doesn't exist |
192 |
cy.document().then(doc => { |
193 |
const button = doc.createElement("button"); |
194 |
button.className = "view_edifact_message test-button"; |
195 |
button.setAttribute("data-message-id", "1"); |
196 |
button.setAttribute("data-basketname", "NonExistentBasket"); |
197 |
button.textContent = "View"; |
198 |
doc.body.appendChild(button); |
199 |
}); |
200 |
|
201 |
cy.get(".view_edifact_message").last().click(); |
202 |
|
203 |
cy.wait("@multiMessageResponse"); |
204 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
205 |
|
206 |
// Should expand entire tree as fallback |
207 |
cy.get("#EDI_modal .collapse.show").should("exist"); |
208 |
}); |
209 |
}); |
210 |
|
211 |
describe("Focus Matching Logic", () => { |
212 |
beforeEach(() => { |
213 |
// Mock EDIFACT response with various segment types |
214 |
cy.intercept( |
215 |
"GET", |
216 |
"**/edimsg.pl*", |
217 |
testDataUtils.createMockResponse(edifactTestData.focusTestData) |
218 |
).as("variedSegmentResponse"); |
219 |
}); |
220 |
|
221 |
it("should match basketno in BGM segments", () => { |
222 |
// Create a button with basketno matching BGM element |
223 |
cy.document().then(doc => { |
224 |
const button = doc.createElement("button"); |
225 |
button.className = "view_edifact_message test-button"; |
226 |
button.setAttribute("data-message-id", "1"); |
227 |
button.setAttribute("data-basketno", "12345"); |
228 |
button.textContent = "View"; |
229 |
doc.body.appendChild(button); |
230 |
}); |
231 |
|
232 |
cy.get(".view_edifact_message").last().click(); |
233 |
|
234 |
cy.wait("@variedSegmentResponse"); |
235 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
236 |
|
237 |
// Wait for focus application to complete - longer timeout for BGM matching |
238 |
cy.wait(1000); |
239 |
cy.get('#EDI_modal [data-focus-message="true"]', { |
240 |
timeout: 15000, |
241 |
}).should("exist"); |
242 |
}); |
243 |
|
244 |
it("should match basketname in RFF+ON segments", () => { |
245 |
// Create a button with basketname matching RFF+ON element |
246 |
cy.document().then(doc => { |
247 |
const button = doc.createElement("button"); |
248 |
button.className = "view_edifact_message test-button"; |
249 |
button.setAttribute("data-message-id", "1"); |
250 |
button.setAttribute("data-basketname", "TestBasket001"); |
251 |
button.textContent = "View"; |
252 |
doc.body.appendChild(button); |
253 |
}); |
254 |
|
255 |
cy.get(".view_edifact_message").last().click(); |
256 |
|
257 |
cy.wait("@variedSegmentResponse"); |
258 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
259 |
cy.get('#EDI_modal [data-focus-message="true"]').should("exist"); |
260 |
}); |
261 |
|
262 |
it("should match invoicenumber in RFF+IV segments", () => { |
263 |
// Create a button with invoicenumber matching RFF+IV element |
264 |
cy.document().then(doc => { |
265 |
const button = doc.createElement("button"); |
266 |
button.className = "view_edifact_message test-button"; |
267 |
button.setAttribute("data-message-id", "1"); |
268 |
button.setAttribute("data-invoicenumber", "TEST_INVOICE_001"); |
269 |
button.textContent = "View"; |
270 |
doc.body.appendChild(button); |
271 |
}); |
272 |
|
273 |
cy.get(".view_edifact_message").last().click(); |
274 |
|
275 |
cy.wait("@variedSegmentResponse"); |
276 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
277 |
cy.get('#EDI_modal [data-focus-message="true"]').should("exist"); |
278 |
}); |
279 |
|
280 |
it("should match invoicenumber in RFF+VN segments", () => { |
281 |
// Create a button with invoicenumber matching RFF+VN element |
282 |
cy.document().then(doc => { |
283 |
const button = doc.createElement("button"); |
284 |
button.className = "view_edifact_message test-button"; |
285 |
button.setAttribute("data-message-id", "1"); |
286 |
button.setAttribute("data-invoicenumber", "TEST_INVOICE_001"); |
287 |
button.textContent = "View"; |
288 |
doc.body.appendChild(button); |
289 |
}); |
290 |
|
291 |
cy.get(".view_edifact_message").last().click(); |
292 |
|
293 |
cy.wait("@variedSegmentResponse"); |
294 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
295 |
cy.get('#EDI_modal [data-focus-message="true"]').should("exist"); |
296 |
}); |
297 |
|
298 |
it("should handle numeric basketno comparison correctly", () => { |
299 |
// Test with numeric basketno |
300 |
cy.document().then(doc => { |
301 |
const button = doc.createElement("button"); |
302 |
button.className = "view_edifact_message test-button-numeric"; |
303 |
button.setAttribute("data-message-id", "1"); |
304 |
button.setAttribute("data-basketno", "12345"); |
305 |
button.textContent = "View Numeric"; |
306 |
button.style.position = "fixed"; |
307 |
button.style.top = "10px"; |
308 |
button.style.left = "10px"; |
309 |
button.style.zIndex = "9999"; |
310 |
doc.body.appendChild(button); |
311 |
}); |
312 |
|
313 |
cy.get(".test-button-numeric").click({ force: true }); |
314 |
|
315 |
cy.wait("@variedSegmentResponse"); |
316 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
317 |
|
318 |
// Wait for focus application and numeric comparison logic to complete |
319 |
cy.wait(1000); |
320 |
cy.get('#EDI_modal [data-focus-message="true"]', { |
321 |
timeout: 15000, |
322 |
}).should("exist"); |
323 |
}); |
324 |
|
325 |
it("should handle string basketname comparison correctly", () => { |
326 |
// Test with string basketname |
327 |
cy.document().then(doc => { |
328 |
const button = doc.createElement("button"); |
329 |
button.className = "view_edifact_message test-button-string"; |
330 |
button.setAttribute("data-message-id", "1"); |
331 |
button.setAttribute("data-basketname", "TestBasket001"); |
332 |
button.textContent = "View String"; |
333 |
button.style.position = "fixed"; |
334 |
button.style.top = "10px"; |
335 |
button.style.left = "10px"; |
336 |
button.style.zIndex = "9999"; |
337 |
doc.body.appendChild(button); |
338 |
}); |
339 |
|
340 |
cy.get(".test-button-string").click({ force: true }); |
341 |
|
342 |
cy.wait("@variedSegmentResponse"); |
343 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
344 |
cy.get('#EDI_modal [data-focus-message="true"]').should("exist"); |
345 |
}); |
346 |
|
347 |
it("should handle non-numeric basketno without padding", () => { |
348 |
// Test with text basketno that should NOT be padded |
349 |
cy.document().then(doc => { |
350 |
const button = doc.createElement("button"); |
351 |
button.className = |
352 |
"view_edifact_message test-button-text-basketno"; |
353 |
button.setAttribute("data-message-id", "1"); |
354 |
button.setAttribute("data-basketno", "BASKET_TEXT_001"); |
355 |
button.textContent = "View Text Basketno"; |
356 |
button.style.position = "fixed"; |
357 |
button.style.top = "10px"; |
358 |
button.style.left = "10px"; |
359 |
button.style.zIndex = "9999"; |
360 |
doc.body.appendChild(button); |
361 |
}); |
362 |
|
363 |
cy.get(".test-button-text-basketno").click({ force: true }); |
364 |
|
365 |
cy.wait("@variedSegmentResponse"); |
366 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
367 |
|
368 |
// Wait for focus application to complete |
369 |
cy.wait(1000); |
370 |
cy.get('#EDI_modal [data-focus-message="true"]', { |
371 |
timeout: 15000, |
372 |
}).should("exist"); |
373 |
}); |
374 |
|
375 |
it("should pad numeric basketno to 11 digits for matching", () => { |
376 |
// This test verifies that numeric basketno 67890 gets padded to 00000067890 |
377 |
// and matches the test data which has the padded version |
378 |
cy.document().then(doc => { |
379 |
const button = doc.createElement("button"); |
380 |
button.className = "view_edifact_message test-button-padding"; |
381 |
button.setAttribute("data-message-id", "1"); |
382 |
button.setAttribute("data-basketno", "67890"); |
383 |
button.textContent = "View Padded Basketno"; |
384 |
button.style.position = "fixed"; |
385 |
button.style.top = "10px"; |
386 |
button.style.left = "10px"; |
387 |
button.style.zIndex = "9999"; |
388 |
doc.body.appendChild(button); |
389 |
}); |
390 |
|
391 |
cy.get(".test-button-padding").click({ force: true }); |
392 |
|
393 |
cy.wait("@variedSegmentResponse"); |
394 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
395 |
|
396 |
// Wait for focus application and padding logic to complete |
397 |
cy.wait(1000); |
398 |
cy.get('#EDI_modal [data-focus-message="true"]', { |
399 |
timeout: 15000, |
400 |
}).should("exist"); |
401 |
|
402 |
// Verify it's the correct message (should find focus highlighting) |
403 |
cy.get('#EDI_modal [data-focus-message="true"]').should("exist"); |
404 |
}); |
405 |
}); |
406 |
|
407 |
describe("Focus Cleanup", () => { |
408 |
it("should remove focus highlighting when modal closes", () => { |
409 |
// Mock EDIFACT response with focus data |
410 |
cy.intercept( |
411 |
"GET", |
412 |
"**/edimsg.pl*", |
413 |
testDataUtils.createMockResponse( |
414 |
testDataUtils.getFocusData("basketno", "12345") |
415 |
) |
416 |
).as("focusResponse"); |
417 |
|
418 |
// Create a button with focus |
419 |
cy.document().then(doc => { |
420 |
const button = doc.createElement("button"); |
421 |
button.className = "view_edifact_message test-button-focus"; |
422 |
button.setAttribute("data-message-id", "1"); |
423 |
button.setAttribute("data-basketno", "12345"); |
424 |
button.textContent = "View"; |
425 |
button.style.position = "fixed"; |
426 |
button.style.top = "10px"; |
427 |
button.style.left = "10px"; |
428 |
button.style.zIndex = "9999"; |
429 |
doc.body.appendChild(button); |
430 |
}); |
431 |
|
432 |
cy.get(".test-button-focus").click({ force: true }); |
433 |
|
434 |
cy.wait("@focusResponse"); |
435 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
436 |
|
437 |
// Wait for initial focus highlighting to be applied |
438 |
cy.wait(1000); |
439 |
cy.get("#EDI_modal .edi-focused-message", { |
440 |
timeout: 10000, |
441 |
}).should("exist"); |
442 |
|
443 |
// Close modal |
444 |
cy.get("#EDI_modal .btn-close").click(); |
445 |
|
446 |
// Wait for modal to be fully hidden and reset |
447 |
cy.get("#EDI_modal").should("not.be.visible"); |
448 |
cy.wait(500); // Give modal time to fully reset |
449 |
|
450 |
// Reopen modal |
451 |
cy.get(".test-button-focus").click({ force: true }); |
452 |
|
453 |
cy.wait("@focusResponse"); |
454 |
cy.get("#EDI_modal", { timeout: 10000 }).should("be.visible"); |
455 |
cy.get("#EDI_modal .edi-tree", { timeout: 10000 }).should( |
456 |
"be.visible" |
457 |
); |
458 |
|
459 |
// Wait for focus highlighting to be re-applied |
460 |
cy.wait(1000); |
461 |
|
462 |
// Focus highlighting should be clean on reopen |
463 |
cy.get("#EDI_modal .edi-focused-message", { |
464 |
timeout: 10000, |
465 |
}).should("exist"); |
466 |
}); |
467 |
|
468 |
it("should handle multiple focus parameters correctly", () => { |
469 |
// Mock EDIFACT response with multiple matching elements |
470 |
cy.intercept( |
471 |
"GET", |
472 |
"**/edimsg.pl*", |
473 |
testDataUtils.createMockResponse(edifactTestData.focusTestData) |
474 |
).as("multiFocusResponse"); |
475 |
|
476 |
// Create a button with multiple focus parameters |
477 |
cy.document().then(doc => { |
478 |
const button = doc.createElement("button"); |
479 |
button.className = "view_edifact_message test-button"; |
480 |
button.setAttribute("data-message-id", "1"); |
481 |
button.setAttribute("data-basketno", "12345"); |
482 |
button.setAttribute("data-basketname", "TestBasket001"); |
483 |
button.textContent = "View"; |
484 |
doc.body.appendChild(button); |
485 |
}); |
486 |
|
487 |
cy.get(".view_edifact_message").last().click(); |
488 |
|
489 |
cy.wait("@multiFocusResponse"); |
490 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
491 |
cy.get('#EDI_modal [data-focus-message="true"]').should("exist"); |
492 |
}); |
493 |
}); |
494 |
|
495 |
describe("Cross-View Focus Persistence", () => { |
496 |
beforeEach(() => { |
497 |
// Mock EDIFACT response with focus data |
498 |
cy.intercept( |
499 |
"GET", |
500 |
"**/edimsg.pl*", |
501 |
testDataUtils.createMockResponse(edifactTestData.focusTestData) |
502 |
).as("crossViewResponse"); |
503 |
}); |
504 |
|
505 |
it("should maintain focus highlighting when switching from Tree to Raw view", () => { |
506 |
// Create a button with basketname focus |
507 |
cy.document().then(doc => { |
508 |
const button = doc.createElement("button"); |
509 |
button.className = "view_edifact_message test-button"; |
510 |
button.setAttribute("data-message-id", "1"); |
511 |
button.setAttribute("data-basketname", "TestBasket001"); |
512 |
button.textContent = "View"; |
513 |
doc.body.appendChild(button); |
514 |
}); |
515 |
|
516 |
cy.get(".view_edifact_message").last().click(); |
517 |
cy.wait("@crossViewResponse"); |
518 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
519 |
|
520 |
// Verify focus highlighting exists in Tree view |
521 |
cy.get('#EDI_modal [data-view="tree"]').should( |
522 |
"have.class", |
523 |
"active" |
524 |
); |
525 |
cy.get("#EDI_modal .edi-focused-message").should("exist"); |
526 |
|
527 |
// Switch to Raw view |
528 |
cy.get('#EDI_modal [data-view="raw"]').click(); |
529 |
cy.get('#EDI_modal [data-view="raw"]').should( |
530 |
"have.class", |
531 |
"active" |
532 |
); |
533 |
|
534 |
// Verify focus highlighting exists in Raw view |
535 |
cy.get("#EDI_modal .edi-focused-segment-line").should("exist"); |
536 |
cy.get("#EDI_modal .edi-focused-segment-line").should( |
537 |
"have.length.greaterThan", |
538 |
0 |
539 |
); |
540 |
}); |
541 |
|
542 |
it("should maintain focus highlighting when switching from Raw to Tree view", () => { |
543 |
// Create a button with basketname focus |
544 |
cy.document().then(doc => { |
545 |
const button = doc.createElement("button"); |
546 |
button.className = "view_edifact_message test-button"; |
547 |
button.setAttribute("data-message-id", "1"); |
548 |
button.setAttribute("data-basketname", "TestBasket001"); |
549 |
button.textContent = "View"; |
550 |
doc.body.appendChild(button); |
551 |
}); |
552 |
|
553 |
cy.get(".view_edifact_message").last().click(); |
554 |
cy.wait("@crossViewResponse"); |
555 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
556 |
|
557 |
// Start in Tree view, then switch to Raw view |
558 |
cy.get('#EDI_modal [data-view="raw"]').click(); |
559 |
cy.get("#EDI_modal .edi-focused-segment-line").should("exist"); |
560 |
|
561 |
// Switch back to Tree view |
562 |
cy.get('#EDI_modal [data-view="tree"]').click(); |
563 |
cy.get('#EDI_modal [data-view="tree"]').should( |
564 |
"have.class", |
565 |
"active" |
566 |
); |
567 |
|
568 |
// Verify focus highlighting still exists in Tree view |
569 |
cy.get("#EDI_modal .edi-focused-message").should("exist"); |
570 |
cy.get('#EDI_modal [data-focus-message="true"]').should("exist"); |
571 |
}); |
572 |
|
573 |
it("should highlight correct message segments in Raw view", () => { |
574 |
// Create a button with basketname focus |
575 |
cy.document().then(doc => { |
576 |
const button = doc.createElement("button"); |
577 |
button.className = "view_edifact_message test-button"; |
578 |
button.setAttribute("data-message-id", "1"); |
579 |
button.setAttribute("data-basketname", "TestBasket001"); |
580 |
button.textContent = "View"; |
581 |
doc.body.appendChild(button); |
582 |
}); |
583 |
|
584 |
cy.get(".view_edifact_message").last().click(); |
585 |
cy.wait("@crossViewResponse"); |
586 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
587 |
|
588 |
// Switch to Raw view |
589 |
cy.get('#EDI_modal [data-view="raw"]').click(); |
590 |
|
591 |
// Verify that focused segment lines have the correct message index |
592 |
cy.get("#EDI_modal .edi-focused-segment-line").should("exist"); |
593 |
cy.get("#EDI_modal .edi-focused-segment-line") |
594 |
.first() |
595 |
.should("have.attr", "data-message-index"); |
596 |
|
597 |
// Verify visual styling is applied |
598 |
cy.get("#EDI_modal .edi-focused-segment-line").should( |
599 |
"have.css", |
600 |
"background-color" |
601 |
); |
602 |
cy.get("#EDI_modal .edi-focused-segment-line").should( |
603 |
"have.css", |
604 |
"border-left-color" |
605 |
); |
606 |
}); |
607 |
|
608 |
it("should scroll to focused content when switching views", () => { |
609 |
// Create a button with basketname focus |
610 |
cy.document().then(doc => { |
611 |
const button = doc.createElement("button"); |
612 |
button.className = "view_edifact_message test-button"; |
613 |
button.setAttribute("data-message-id", "1"); |
614 |
button.setAttribute("data-basketname", "TestBasket001"); |
615 |
button.textContent = "View"; |
616 |
doc.body.appendChild(button); |
617 |
}); |
618 |
|
619 |
cy.get(".view_edifact_message").last().click(); |
620 |
cy.wait("@crossViewResponse"); |
621 |
cy.get("#EDI_modal .edi-tree").should("be.visible"); |
622 |
|
623 |
// Switch to Raw view and verify focused content is visible |
624 |
cy.get('#EDI_modal [data-view="raw"]').click(); |
625 |
cy.wait(200); // Wait for scroll animation |
626 |
|
627 |
cy.get("#EDI_modal .edi-focused-segment-line") |
628 |
.first() |
629 |
.should("be.visible"); |
630 |
|
631 |
// Switch back to Tree view and verify focused content is visible |
632 |
cy.get('#EDI_modal [data-view="tree"]').click(); |
633 |
cy.wait(200); // Wait for scroll animation |
634 |
|
635 |
cy.get("#EDI_modal .edi-focused-message").should("be.visible"); |
636 |
}); |
637 |
}); |
638 |
}); |