fix: split button into 2 button components to fix issue in firefox. (… (#23914)

…#23900)

## Description

Split button into 2 button components to fix issue in firefox. Slack
Thread:
https://theappsmith.slack.com/archives/CGBPVEJ5C/p1685460441276709

#### PR fixes following issue(s)
Fixes #23902
#### Type of change
- Bug fix (non-breaking change which fixes an issue) ## Testing
>
#### How Has This Been Tested?
> Please describe the tests that you ran to verify your changes. Also
list any relevant details for your test configuration.
> Delete anything that is not relevant
- [x] Manual
- [ ] Jest
- [x] Cypress
>
>
#### Test Plan
> Add Testsmith test cases links that relate to this PR
>
>
#### Issues raised during DP testing
> Link issues raised during DP testing for better visiblity and tracking
(copy link from comments dropped on this PR)
>
>
>
## Checklist:
#### Dev activity
- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


#### QA activity:
- [ ] [Speedbreak
features](https://github.com/appsmithorg/TestSmith/wiki/Test-plan-implementation#speedbreaker-features-to-consider-for-every-change)
have been covered
- [ ] Test plan covers all impacted features and [areas of
interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans/_edit#areas-of-interest)
- [ ] Test plan has been peer reviewed by project stakeholders and other
QA members
- [ ] Manually tested functionality on DP
- [ ] We had an implementation alignment call with stakeholders post QA
Round 2
- [ ] Cypress test cases have been added and approved by SDET/manual QA
- [ ] Added `Test Plan Approved` label after Cypress tests were reviewed
- [ ] Added `Test Plan Approved` label after JUnit tests were reviewed

> Pull Request Template
>
> Use this template to quickly create a well written pull request.
Delete all quotes before creating the pull request.
>
## Description
> Add a TL;DR when description is extra long (helps content team)
>
> Please include a summary of the changes and which issue has been
fixed. Please also include relevant motivation
> and context. List any dependencies that are required for this change
>
> Links to Notion, Figma or any other documents that might be relevant
to the PR
>
>
#### PR fixes following issue(s)
Fixes # (issue number)
> if no issue exists, please create an issue and ask the maintainers
about this first
>
>
#### Media
> A video or a GIF is preferred. when using Loom, don’t embed because it
looks like it’s a GIF. instead, just link to the video
>
>
#### Type of change
> Please delete options that are not relevant.
- Bug fix (non-breaking change which fixes an issue)
- New feature (non-breaking change which adds functionality)
- Breaking change (fix or feature that would cause existing
functionality to not work as expected)
- Chore (housekeeping or task changes that don't impact user perception)
- This change requires a documentation update
>
>
>
## Testing
>
#### How Has This Been Tested?
> Please describe the tests that you ran to verify your changes. Also
list any relevant details for your test configuration.
> Delete anything that is not relevant
- [ ] Manual
- [ ] Jest
- [ ] Cypress
>
>
#### Test Plan
> Add Testsmith test cases links that relate to this PR
>
>
#### Issues raised during DP testing
> Link issues raised during DP testing for better visiblity and tracking
(copy link from comments dropped on this PR)
>
>
>
## Checklist:
#### Dev activity
- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


#### QA activity:
- [ ] [Speedbreak
features](https://github.com/appsmithorg/TestSmith/wiki/Test-plan-implementation#speedbreaker-features-to-consider-for-every-change)
have been covered
- [ ] Test plan covers all impacted features and [areas of
interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans/_edit#areas-of-interest)
- [ ] Test plan has been peer reviewed by project stakeholders and other
QA members
- [ ] Manually tested functionality on DP
- [ ] We had an implementation alignment call with stakeholders post QA
Round 2
- [ ] Cypress test cases have been added and approved by SDET/manual QA
- [ ] Added `Test Plan Approved` label after Cypress tests were reviewed
- [ ] Added `Test Plan Approved` label after JUnit tests were reviewed
This commit is contained in:
Dipyaman Biswas 2023-05-31 15:13:52 +05:30 committed by GitHub
parent 391bfaecd3
commit b6c5a1f642
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 44 additions and 30 deletions

View File

@ -9,6 +9,7 @@
"roleInput": ".t--welcome-form-role-input input",
"useCaseDropdown": ".t--welcome-form-role-usecase",
"useCaseDropdownOption": ".rc-select-item-option-content",
"continueButton": ".t--welcome-form-continue-button",
"submitButton": ".t--welcome-form-submit-button",
"dataCollection": ".t--welcome-form-datacollection",
"newsLetter": ".t--welcome-form-newsletter",

View File

@ -1280,17 +1280,17 @@ Cypress.Commands.add("createSuperUser", () => {
cy.get(welcomePage.email).should("be.visible");
cy.get(welcomePage.password).should("be.visible");
cy.get(welcomePage.verifyPassword).should("be.visible");
cy.get(welcomePage.submitButton).should("be.disabled");
cy.get(welcomePage.continueButton).should("be.disabled");
cy.get(welcomePage.firstName).type(Cypress.env("USERNAME"));
cy.get(welcomePage.submitButton).should("be.disabled");
cy.get(welcomePage.continueButton).should("be.disabled");
cy.get(welcomePage.email).type(Cypress.env("USERNAME"));
cy.get(welcomePage.submitButton).should("be.disabled");
cy.get(welcomePage.continueButton).should("be.disabled");
cy.get(welcomePage.password).type(Cypress.env("PASSWORD"));
cy.get(welcomePage.submitButton).should("be.disabled");
cy.get(welcomePage.continueButton).should("be.disabled");
cy.get(welcomePage.verifyPassword).type(Cypress.env("PASSWORD"));
cy.get(welcomePage.submitButton).should("not.be.disabled");
cy.get(welcomePage.submitButton).click();
cy.get(welcomePage.continueButton).should("not.be.disabled");
cy.get(welcomePage.continueButton).click();
cy.get(welcomePage.roleDropdown).click();
cy.get(welcomePage.roleDropdownOption).eq(1).click();
@ -1300,14 +1300,7 @@ Cypress.Commands.add("createSuperUser", () => {
cy.get(welcomePage.submitButton).should("not.be.disabled");
cy.get(welcomePage.submitButton).click();
//in case of airgapped both anonymous data and newsletter are disabled
if (!Cypress.env("AIRGAPPED")) {
cy.wait("@createSuperUser").then((interception) => {
expect(interception.request.body).contains(
"allowCollectingAnonymousData=true",
);
expect(interception.request.body).contains("signupForNewsletter=true");
});
} else {
if (Cypress.env("AIRGAPPED")) {
cy.wait("@createSuperUser").then((interception) => {
expect(interception.request.body).to.not.contain(
"allowCollectingAnonymousData=true",
@ -1316,6 +1309,13 @@ Cypress.Commands.add("createSuperUser", () => {
"signupForNewsletter=true",
);
});
} else {
cy.wait("@createSuperUser").then((interception) => {
expect(interception.request.body).contains(
"allowCollectingAnonymousData=true",
);
expect(interception.request.body).contains("signupForNewsletter=true");
});
}
cy.LogOut();

View File

@ -182,22 +182,35 @@ export default function DetailsForm(
)}
</div>
)}
<ButtonWrapper>
<Button
className="t--welcome-form-submit-button w-100"
isDisabled={props.invalid}
kind="primary"
onClick={() => {
if (isFirstPage) setFormState(1);
}}
size="md"
type={isFirstPage ? "button" : "submit"}
>
{isFirstPage
? createMessage(CONTINUE)
: createMessage(ONBOARDING_STATUS_GET_STARTED)}
</Button>
</ButtonWrapper>
{isFirstPage && (
<ButtonWrapper>
<Button
className="t--welcome-form-continue-button w-100"
isDisabled={props.invalid}
kind="primary"
onClick={() => {
setFormState(1);
}}
size="md"
type="button"
>
{createMessage(CONTINUE)}
</Button>
</ButtonWrapper>
)}
{!isFirstPage && (
<ButtonWrapper>
<Button
className="t--welcome-form-submit-button w-100"
isDisabled={props.invalid}
kind="primary"
size="md"
type="submit"
>
{createMessage(ONBOARDING_STATUS_GET_STARTED)}
</Button>
</ButtonWrapper>
)}
</StyledFormBodyWrapper>
</DetailsFormWrapper>
);