croissant-opt-in-container
Initialization
Test Case: Verify Component Renders with Initial Configuration
Description: Confirm that the Croissant Opt-In Container
initializes correctly based on the provided props.
Assertion:
- Assert that the component renders correctly.
- Assert that the initial
price
is displayed accurately if applicable. - Assert that
customStyles
are applied correctly based on the initial configuration.
Functionality
Test Case: Modal Visibility Toggle
Description: Ensure the modal associated with the content's Learn More
or equivalent action toggles its visibility as expected upon user interaction.
Assertion:
- Trigger the action (e.g., clicking
Learn More
) intended to show the modal. - Assert that the
Croissant Modal
becomes visible. - Close the modal.
- Assert that the modal is no longer visible.
Test Case: Dynamic Style Application
Description: Verify that the component dynamically applies styles based on customStyles
.
Assertion:
- Assert that the component's border color, or other style elements, are set correctly based on
customStyles.primaryColor
.
Test Case: Opt-In Action
Description: Confirm that the opt-in action (e.g., selecting an option from the RadioInputForm
) correctly triggers any associated events or changes.
Assertion:
- Perform the opt-in action.
- Assert that the correct events are emitted (e.g.,
EventsTypes.RadioButtonViewed
). - Optionally, verify that local storage or other state indicators are updated to reflect the opt-in status.
Interaction with Content and Header
Test Case: Header and Content Display
Description: Verify that the OptInContainerHeader
and OptInContainerContent
are displayed correctly and contain the expected content.
Assertion:
- Assert that the header is present and correctly styled.
- Assert that the content area includes expected elements (e.g., promotional text, pricing information, radio inputs).
Test Case: Price Update in Content
Description: Ensure that updating the price
prop correctly updates the display within OptInContainerContent
or related child components.
Assertion:
- Update the
price
prop of the component with a new value. - Assert that the displayed price within the component updates to reflect this new value.
User Interaction with RadioInputForm
Test Case: Radio Selection and Form Submission
Description: Confirm that selecting an option in the RadioInputForm
and submitting (if applicable) performs the expected actions, such as updating user opt-in status.
Assertion:
- Select an option in the
RadioInputForm
. - Submit the form if a submit action is required.
- Assert that the selection is registered and any expected outcomes (such as opt-in status update) are achieved.
Updated 9 months ago