Backspace key removing the entire text instead of the left char while running in headless mode
manoj-fd opened this issue · comments
Current behavior
Following are the sample steps from my spec, script enters a Full SSN in a text box and following key event performed.
page.ssn().clear().type(full_ssn)
page.ssn().type('{moveToStart}')
page.ssn().type('{rightArrow}'.repeat(i))
page.ssn().type('{backspace}')
page.ssn().type(3)Expected Behaviour : the left char has to be removed after backspace
Actua Behaviour: entire text is removed and its newly entering 3.
Note: This behaviour currently encountered with firefox headless mode, its working fine with firefox normal mode and chrome/edge headless mode.
Desired behavior
Expecting firefox to have similar behaviour as like chrome/edge browsers
page.ssn().clear().type(full_ssn)
page.ssn().type('{moveToStart}')
page.ssn().type('{rightArrow}'.repeat(i))
page.ssn().type('{backspace}')
page.ssn().type(3)only the character on the left side has to be removed instead of entire text while clicking backspace
Test code to reproduce
full_ssn ='123456789'
for (let i = 1; i < full_ssn.length + 2; i++) {
page.ssn().type('{moveToStart}')
page.ssn().type('{rightArrow}'.repeat(i))
page.ssn().type('{backspace}')
if (i >= 7) {
page.ssn().type(full_ssn[i - 3])
} else if (i >= 4) {
page.ssn().type(full_ssn[i - 2])
} else {
page.ssn().type(full_ssn[i - 1])
}
}Cypress Version
11.2.0
Node version
v18.0.0
Operating System
macOS 12.6.1
Debug Logs
[0] cypress:server:util:socket_allowed allowed socket closed, removing { localPort: 60840 } +2s
[0] cypress:server:socket-base automation:request take:screenshot { titles: [ 'dVerification Page', 'Should replace SSN9 digits in the correct location after backspace.' ], testId: 'r5', testAttemptIndex: 1, simple: true, testFailure: true, capture: 'runner', clip: { x: 0, y: 0, width: 1280, height: 720 }, viewport: { width: 1280, height: 720 }, scaled: true, blackout: [], overwrite: false, startTime: '2023-01-27T09:53:07.834Z' } +11s
[0] cypress:server:screenshot (s239) capturing screenshot { titles: [ 'dVerification Page', 'Should replace SSN9 digits in the correct location after backspace.' ], testId: 'r5', testAttemptIndex: 1, simple: true, testFailure: true, capture: 'runner', clip: { x: 0, y: 0, width: 1280, height: 720 }, viewport: { width: 1280, height: 720 }, scaled: true, blackout: [], overwrite: false, startTime: '2023-01-27T09:53:07.834Z', specName: 'verification.spec.js' } +18s
[0] cypress:server:screenshot (s239) ensureSafePath { withoutExt: '/Users/manoj.gangadharan/CB/app/integration/cypress/results/screenshots/verification.spec.js/dVerification Page -- Should replace SSN9 digits in the correct location after backspace (failed) (attempt 2)', extension: 'png', num: 0, maxSafeBytes: 254, maxSafePrefixBytes: 250 } +61ms
[0] cypress:server:screenshot (s239) save /Users/manoj.gangadharan/CB/app/integration/cypress/results/screenshots/verification.spec.js/dVerification Page -- Should replace SSN9 digits in the correct location after backspace (failed) (attempt 2).png +0ms
[0] cypress:lifecycle:EventRegistrar plugin event registered? { eventName: 'after:screenshot', isRegistered: false } +18s
[0] cypress:server:project onMocha fail +17s
[0] cypress:server:reporter got mocha event 'fail' with args: [ { _testConfig: { testConfigList: [], unverifiedTestConfig: {}, applied: 'complete' }, id: 'r5', title: 'Should replace SSN9 digits in the correct location after backspace.', err: { message: "Timed out retrying after 10000ms: expected '<input#ssnField.ObfuscatedField_control_11c00s._1h6hb4l>' to have value '311-13-1111', but the value was '3'", name: 'AssertionError', stack: "AssertionError: Timed out retrying after 10000ms: expected '<input#ssnField.ObfuscatedField_control_11c00s._1h6hb4l>' to have value '311-13-1111', but the value was '3'\n" + ' at (webpack://app/./integration/cypress/acceptance/d/account/verification.spec.js:1:3716)\n' + ' at ../driver/src/cypress/cy.ts/setRunnable/runnable.fn (https://localhost:3001/__cypress/runner/cypress_runner.js:158117:43)\n' + ' at callFn (https://localhost:3001/__cypress/runner/cypress_runner.js:108004:21)\n' + ' at ../driver/src/cypress/runner.ts/create/onRunnableRun (https://localhost:3001/__cypress/runner/cypress_runner.js:165458:30)\n' + ' at finallyHandler (https://localhost:3001/__cypress/runner/cypress_runner.js:7881:23)\n' + ' at tryCatcher (https://localhost:3001/__cypress/runner/cypress_runner.js:11327:23)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromiseFromHandler (https://localhost:3001/__cypress/runner/cypress_runner.js:9262:31)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromise (https://localhost:3001/__cypress/runner/cypress_runner.js:9319:18)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromise0 (https://localhost:3001/__cypress/runner/cypress_runner.js:9364:10)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromises (https://localhost:3001/__cypress/runner/cypress_runner.js:9444:18)\n' + ' at _drainQueueStep (https://localhost:3001/__cypress/runner/cypress_runner.js:6034:12)\n' + ' at _drainQueue (https://localhost:3001/__cypress/runner/cypress_runner.js:6027:24)\n' + ' at ../../node_modules/bluebird/js/release/async.js/</Async.prototype._drainQueues (https://localhost:3001/__cypress/runner/cypress_runner.js:6043:16)\n' + ' at ../../node_modules/bluebird/js/release/async.js/</Async/this.drainQueues (https://localhost:3001/__cypress/runner/cypress_runner.js:5913:14)', parsedStack: [Array], actual: "'3'", expected: "'311-13-1111'", showDiff: true, codeFrame: [Object] }, state: 'failed', body: "function () { cy.mockFailedSSN4Flow(); _verificationPage.default.visit(_user_default.default); _verificationAttempt.default.fillVerificationForm(); _verificationPage.default.ssn().should('be.visible'); _verificationPage.default.toggleHiddenButton().click(); _verificationPage.default.ssn().clear().type(_validPersonDetails.default.full_ssn); for (var i = 1; i < _validPersonDetails.default.full_ssn.length + 2; i++) {\n" + " _verificationPage.default.ssn().type('{moveToStart}');\n" + " _verificationPage.default.ssn().type('{rightArrow}'.repeat(i));\n" + " _verificationPage.default.ssn().type('{backspace}');\n" + ' if (i >= 7) {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 3]);\n' + ' }\n' + ' else if (i >= 4) {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 2]);\n' + ' }\n' + ' else {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 1]);\n' + ' }\n' + " _verificationPage.default.ssn().should('have.value', _validPersonDetails.default.full_ssn.replace(/(\\d{3})(\\d{2})(\\d+)/, '$1-$2-$3'));\n" + '} }', type: 'test', duration: 18255, wallClockStartedAt: '2023-01-27T09:52:49.645Z', timings: { lifecycle: 53, 'before each': [Array], test: [Object] }, file: null, currentRetry: 1, retries: 1, _slow: 10000 } ] +17s
[0] 1) Should replace SSN9 digits in the correct location after backspace.
[0] cypress:server:project onMocha test end +5ms
[0] cypress:server:reporter got mocha event 'test end' with args: [ { _testConfig: { testConfigList: [], unverifiedTestConfig: {}, applied: 'complete' }, id: 'r5', title: 'Should replace SSN9 digits in the correct location after backspace.', err: { message: "Timed out retrying after 10000ms: expected '<input#ssnField.ObfuscatedField_control_11c00s._1h6hb4l>' to have value '311-13-1111', but the value was '3'", name: 'AssertionError', stack: "AssertionError: Timed out retrying after 10000ms: expected '<input#ssnField.ObfuscatedField_control_11c00s._1h6hb4l>' to have value '311-13-1111', but the value was '3'\n" + ' at (webpack://app/./integration/cypress/acceptance/d/account/verification.spec.js:1:3716)\n' + ' at ../driver/src/cypress/cy.ts/setRunnable/runnable.fn (https://localhost:3001/__cypress/runner/cypress_runner.js:158117:43)\n' + ' at callFn (https://localhost:3001/__cypress/runner/cypress_runner.js:108004:21)\n' + ' at ../driver/src/cypress/runner.ts/create/onRunnableRun (https://localhost:3001/__cypress/runner/cypress_runner.js:165458:30)\n' + ' at finallyHandler (https://localhost:3001/__cypress/runner/cypress_runner.js:7881:23)\n' + ' at tryCatcher (https://localhost:3001/__cypress/runner/cypress_runner.js:11327:23)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromiseFromHandler (https://localhost:3001/__cypress/runner/cypress_runner.js:9262:31)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromise (https://localhost:3001/__cypress/runner/cypress_runner.js:9319:18)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromise0 (https://localhost:3001/__cypress/runner/cypress_runner.js:9364:10)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromises (https://localhost:3001/__cypress/runner/cypress_runner.js:9444:18)\n' + ' at _drainQueueStep (https://localhost:3001/__cypress/runner/cypress_runner.js:6034:12)\n' + ' at _drainQueue (https://localhost:3001/__cypress/runner/cypress_runner.js:6027:24)\n' + ' at ../../node_modules/bluebird/js/release/async.js/</Async.prototype._drainQueues (https://localhost:3001/__cypress/runner/cypress_runner.js:6043:16)\n' + ' at ../../node_modules/bluebird/js/release/async.js/</Async/this.drainQueues (https://localhost:3001/__cypress/runner/cypress_runner.js:5913:14)', parsedStack: [Array], actual: "'3'", expected: "'311-13-1111'", showDiff: true, codeFrame: [Object] }, state: 'failed', body: "function () { cy.mockFailedSSN4Flow(); _verificationPage.default.visit(_user_default.default); _verificationAttempt.default.fillVerificationForm(); _verificationPage.default.ssn().should('be.visible'); _verificationPage.default.toggleHiddenButton().click(); _verificationPage.default.ssn().clear().type(_validPersonDetails.default.full_ssn); for (var i = 1; i < _validPersonDetails.default.full_ssn.length + 2; i++) {\n" + " _verificationPage.default.ssn().type('{moveToStart}');\n" + " _verificationPage.default.ssn().type('{rightArrow}'.repeat(i));\n" + " _verificationPage.default.ssn().type('{backspace}');\n" + ' if (i >= 7) {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 3]);\n' + ' }\n' + ' else if (i >= 4) {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 2]);\n' + ' }\n' + ' else {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 1]);\n' + ' }\n' + " _verificationPage.default.ssn().should('have.value', _validPersonDetails.default.full_ssn.replace(/(\\d{3})(\\d{2})(\\d+)/, '$1-$2-$3'));\n" + '} }', type: 'test', duration: 18255, wallClockStartedAt: '2023-01-27T09:52:49.645Z', timings: { lifecycle: 53, 'before each': [Array], test: [Object] }, file: null, final: true, currentRetry: 1, retries: 1, _slow: 10000 } ] +5ms
[0] cypress:server:project onMocha suite end +29ms
[0] cypress:server:reporter got mocha event 'suite end' with args: [ { id: 'r2', title: 'dVerification Page', root: false, type: 'suite', file: null, invocationDetails: { function: '<unknown>', fileUrl: 'https://localhost:3001/__cypress/tests?p=integration/cypress/acceptance/d/account/verification.spec.js', originalFile: 'webpack://app/./integration/cypress/acceptance/d/account/verification.spec.js', relativeFile: 'integration/cypress/acceptance/d/account/verification.spec.js', absoluteFile: '/Users/manoj.gangadharan/CB/app/integration/cypress/acceptance/d/account/verification.spec.js', line: 1, column: 677, whitespace: '', stack: '@https://localhost:3001/__cypress/tests?p=integration/cypress/acceptance/d/account/verification.spec.js:172:9\n' + '@https://localhost:3001/__cypress/tests?p=integration/cypress/acceptance/d/account/verification.spec.js:188:3\n' + '@https://localhost:3001/__cypress/tests?p=integration/cypress/acceptance/d/account/verification.spec.js:190:12\n' + '../driver/src/cypress/script_utils.ts/evalScripts/<@https://localhost:3001/__cypress/runner/cypress_runner.js:165963:23\n' + 'tryCatcher@https://localhost:3001/__cypress/runner/cypress_runner.js:11327:23\n' + 'gotValue@https://localhost:3001/__cypress/runner/cypress_runner.js:10469:18\n' + 'gotAccum@https://localhost:3001/__cypress/runner/cypress_runner.js:10458:25\n' + 'tryCatcher@https://localhost:3001/__cypress/runner/cypress_runner.js:11327:23\n' + '../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromiseFromHandler@https://localhost:3001/__cypress/runner/cypress_runner.js:9262:31\n' + '../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromise@https://localhost:3001/__cypress/runner/cypress_runner.js:9319:18\n' + '../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromise0@https://localhost:3001/__cypress/runner/cypress_runner.js:9364:10\n' + '../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromises@https://localhost:3001/__cypress/runner/cypress_runner.js:9444:18\n' + '_drainQueueStep@https://localhost:3001/__cypress/runner/cypress_runner.js:6034:12\n' + '_drainQueue@https://localhost:3001/__cypress/runner/cypress_runner.js:6027:24\n' + '../../node_modules/bluebird/js/release/async.js/</Async.prototype._drainQueues@https://localhost:3001/__cypress/runner/cypress_runner.js:6043:16\n' + '../../node_modules/bluebird/js/release/async.js/</Async/this.drainQueues@https://localhost:3001/__cypress/runner/cypress_runner.js:5913:14\n' }, retries: -1, _slow: 10000 } ] +29ms
[0]
[0] cypress:server:project onMocha test:after:run +0ms
[0] cypress:server:reporter got mocha event 'test:after:run' with args: [ { _testConfig: { testConfigList: [], unverifiedTestConfig: {}, applied: 'complete' }, id: 'r5', title: 'Should replace SSN9 digits in the correct location after backspace.', err: { message: "Timed out retrying after 10000ms: expected '<input#ssnField.ObfuscatedField_control_11c00s._1h6hb4l>' to have value '311-13-1111', but the value was '3'", name: 'AssertionError', stack: "AssertionError: Timed out retrying after 10000ms: expected '<input#ssnField.ObfuscatedField_control_11c00s._1h6hb4l>' to have value '311-13-1111', but the value was '3'\n" + ' at (webpack://app/./integration/cypress/acceptance/d/account/verification.spec.js:1:3716)\n' + ' at ../driver/src/cypress/cy.ts/setRunnable/runnable.fn (https://localhost:3001/__cypress/runner/cypress_runner.js:158117:43)\n' + ' at callFn (https://localhost:3001/__cypress/runner/cypress_runner.js:108004:21)\n' + ' at ../driver/src/cypress/runner.ts/create/onRunnableRun (https://localhost:3001/__cypress/runner/cypress_runner.js:165458:30)\n' + ' at finallyHandler (https://localhost:3001/__cypress/runner/cypress_runner.js:7881:23)\n' + ' at tryCatcher (https://localhost:3001/__cypress/runner/cypress_runner.js:11327:23)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromiseFromHandler (https://localhost:3001/__cypress/runner/cypress_runner.js:9262:31)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromise (https://localhost:3001/__cypress/runner/cypress_runner.js:9319:18)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromise0 (https://localhost:3001/__cypress/runner/cypress_runner.js:9364:10)\n' + ' at ../../node_modules/bluebird/js/release/promise.js/</module.exports/Promise.prototype._settlePromises (https://localhost:3001/__cypress/runner/cypress_runner.js:9444:18)\n' + ' at _drainQueueStep (https://localhost:3001/__cypress/runner/cypress_runner.js:6034:12)\n' + ' at _drainQueue (https://localhost:3001/__cypress/runner/cypress_runner.js:6027:24)\n' + ' at ../../node_modules/bluebird/js/release/async.js/</Async.prototype._drainQueues (https://localhost:3001/__cypress/runner/cypress_runner.js:6043:16)\n' + ' at ../../node_modules/bluebird/js/release/async.js/</Async/this.drainQueues (https://localhost:3001/__cypress/runner/cypress_runner.js:5913:14)', parsedStack: [Array], actual: "'3'", expected: "'311-13-1111'", showDiff: true, codeFrame: [Object] }, state: 'failed', body: "function () { cy.mockFailedSSN4Flow(); _verificationPage.default.visit(_user_default.default); _verificationAttempt.default.fillVerificationForm(); _verificationPage.default.ssn().should('be.visible'); _verificationPage.default.toggleHiddenButton().click(); _verificationPage.default.ssn().clear().type(_validPersonDetails.default.full_ssn); for (var i = 1; i < _validPersonDetails.default.full_ssn.length + 2; i++) {\n" + " _verificationPage.default.ssn().type('{moveToStart}');\n" + " _verificationPage.default.ssn().type('{rightArrow}'.repeat(i));\n" + " _verificationPage.default.ssn().type('{backspace}');\n" + ' if (i >= 7) {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 3]);\n' + ' }\n' + ' else if (i >= 4) {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 2]);\n' + ' }\n' + ' else {\n' + ' _verificationPage.default.ssn().type(_validPersonDetails.default.full_ssn[i - 1]);\n' + ' }\n' + " _verificationPage.default.ssn().should('have.value', _validPersonDetails.default.full_ssn.replace(/(\\d{3})(\\d{2})(\\d+)/, '$1-$2-$3'));\n" + '} }', type: 'test', duration: 18255, wallClockStartedAt: '2023-01-27T09:52:49.645Z', wallClockDuration: 18261, timings: { lifecycle: 53, 'before each': [Array], test: [Object] }, file: null, final: true, currentRetry: 1, retries: 1, _slow: 10000 } ] +0ms
[0] cypress:server:project onMocha suite end +0ms
[0] cypress:server:reporter got mocha event 'suite end' with args: [ { id: 'r1', title: '', root: true, type: 'suite', file: 'integration/cypress/acceptance/d/account/verification.spec.js', retries: -1, _slow: 10000 } ] +0ms
[0] cypress:server:project onMocha end +0ms
[0] cypress:server:reporter got mocha event 'end' with args: [ { end: '2023-01-27T09:53:07.925Z' } ] +0ms
[0]
[0] 0 passing (39s)
[0] 2 pending
[0] 1 failing
[0]
[0] 1) dVerification Page
[0] Should replace SSN9 digits in the correct location after backspace.:
[0]
[0] Timed out retrying after 10000ms
[0] + expected - actual
[0]
[0] -'3'
[0] +'311-13-1111'Other
No response
Hi @manoj-fd. Thank you for opening an issue. Would you be able to recreate the steps you posted above in a reproduction repository by forking cypress-test-tiny or by other means? Also, what version of Firefox are you using?
Hi @AtofStryker I am unable to recreate the issue in the [cypress-test-tiny] repo with url - https://example.cypress.io/commands/actions and type method, here is the sample code used.
Firefox version used - v109
The attributes of the original page where issue reported
<input label="Full SSN" placeholder="___-__-____" id="ssnField" data-test-id="field-ssn" styles="[object Object]" theme="[object Object]" type="tel" class="ObfuscatedField_control_11c00s _1h6hb4l" value="351-73-2017">describe("page", () => {
let full_ssn = "351-73-2017";
it("works", () => {
cy.visit("https://example.cypress.io/commands/actions");
cy.get("#email1").clear().type(full_ssn);
for (let i = 1; i < full_ssn.length + 2; i++) {
cy.get("#email1").type("{moveToStart}");
cy.get("#email1").type("{rightArrow}".repeat(2));
cy.get("#email1").type("{backspace}");
if (i >= 7) {
cy.get("#email1").type(full_ssn[i - 3]);
} else if (i >= 4) {
cy.get("#email1").type(full_ssn[i - 2]);
} else {
cy.get("#email1").type(full_ssn[i - 1]);
}
cy.get("#email1").should(
"have.value",
full_ssn.replace(/(\d{3})(\d{2})(\d+)/, "$1$2$3")
);
}
});
});
Hi @manoj-fd, thanks for trying to recreate your issue. However, unless we receive a reliable reproduction, we'll eventually have to close this issue until we can reproduce it. This does not mean that your issue is not happening - it just means that we do not have a path to move forward.
Right now there doesn't seem to be enough information to reproduce the problem on our end. Please comment if there is new information to provide concerning the original issue and we can reopen.
@manoj-fd have you managed to fix it somehow? I am struggling with a similar problem.