feat: add new functionallity for remember me#412
Merged
Conversation
Member
|
@plpmd Thank you! Please, can you also send a PR to the engrid-docs repository, documenting this new option? |
plpmd
commented
Jul 15, 2026
plpmd
left a comment
Contributor
Author
There was a problem hiding this comment.
@fernanDOTdo PR documenting this new option on engrid docs:
4site-interactive-studios/engrid-docs#15
plpmd
marked this pull request as draft
July 15, 2026 19:04
…ction transaction.recurrfreq is a radio group (MONTHLY, ONETIME, ANNUAL, etc). The previous implementation fell through to the generic setFieldValue path, which only checked the first radio in the DOM. If that radio's value didn't match the saved value, nothing was selected. Add explicit handling for recurrfreq (configurable via fieldDonationRecurrFreqRadioName option, defaulting to 'transaction.recurrfreq') that queries the exact radio by value and clicks it, matching the same pattern already used for transaction.donationAmt.
When the donor selected the 'Other' radio and typed a custom amount,
readFields() was storing the radio's own value ('Other' / 'other') instead
of the numeric value the donor entered in the text input.
On the restore side, writeFields() jumped straight to filling the .other
text input without first clicking the 'Other' radio, leaving the input
hidden/disabled in some form configurations.
Fix readFields() to detect when the checked donationAmt radio has value
'other' and persist the numeric value from transaction.donationAmt.other
instead. Fix writeFields() to first click the 'Other' radio before
populating the text input when no predefined radio matches the saved value.
…the DOM SwapAmounts listens to onFrequencyChange and calls enjs.swapList() to replace the donationAmt radio nodes in the DOM. This runs ~1 second after page load via a setTimeout in App.run(), which is after RememberMe has already called writeFields() and selected a radio — wiping that selection. Add reapplyDonationAmtAfterSwap() which subscribes once (via .one()) to onFrequencyChange and, after a 200 ms settle delay, re-clicks the correct donationAmt radio (or fills the Other text input for custom amounts). The handler fires only on the initial frequency load and never again, so it does not interfere with subsequent donor interactions.
plpmd
marked this pull request as ready for review
July 16, 2026 15:45
fernanDOTdo
approved these changes
Jul 20, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
This PR extends the
RememberMecomponent with several new features and bug fixes.1. AES-GCM Cookie Encryption (
encryptData)Adds an
encryptDataboolean option to theRememberMeconstructor. When enabled, the cookie payload is encrypted using browser-native Web Crypto (AES-GCM 256-bit) before being stored, and base64-encoded for transport.How it works:
localStorage(key:engrid-remember-me-key). The key is never written to the cookie itself, so it never travels with the stored data.encryptDataflag is forwarded in thepostMessagepayload so the iframe can apply the same encrypt/decrypt protocol.data-remember.htmlreference implementation has been updated to support the remote encrypted flow.Known limitation: In remote/iframe mode, the key lives in the iframe origin's
localStorage, which is subject to Chrome's third-party storage partitioning.2. Configurable Clear Autofill Label (
fieldClearLabel)Adds a
fieldClearLabelstring option that lets client themes override the text of the clear autofill link shown when pre-filled data is present.(clear autofill)to preserve existing behavior.this.fieldClearLabel, making it fully configurable per instance.3. Hide Remember Me Opt-In (
hide)Adds a
hideboolean option. When set totrue, the Remember Me opt-in UI element is rendered with thehideCSS class, keeping it invisible while still allowing the component to function. Useful when clients want autofill behavior without displaying the opt-in checkbox to the donor.4. Fix: Correctly Restore
transaction.recurrfreqRadio Selectiontransaction.recurrfreqis a radio group (MONTHLY, ONETIME, ANNUAL, etc.). The previous implementation fell through to the genericsetFieldValuepath, which only checked the first radio in the DOM. If that radio did not match the saved value, nothing was selected.Adds explicit handling for
recurrfreq(configurable via the newfieldDonationRecurrFreqRadioNameoption, defaulting totransaction.recurrfreq) that queries the exact radio by value and clicks it, matching the same pattern already used fortransaction.donationAmt.5. Fix: Save and Restore Custom Donation Amount Correctly
When the donor selected the Other radio and typed a custom amount,
readFields()was storing the radio own value (Other) instead of the numeric value the donor entered in the text input.On the restore side,
writeFields()was jumping straight to filling the other text input without first clicking the Other radio, leaving the input hidden/disabled in some form configurations.Fixes:
readFields()now detects when the checkeddonationAmtradio has valueotherand persists the numeric value fromtransaction.donationAmt.otherinstead.writeFields()now first clicks the Other radio before populating the text input when no predefined radio matches the saved value.6. Fix: Reapply Donation Amount After SwapAmounts Replaces the DOM
SwapAmountslistens toonFrequencyChangeand callsenjs.swapList()to replace thedonationAmtradio nodes in the DOM. This runs about 1 second after page load via asetTimeoutinApp.run(), which is afterRememberMehas already calledwriteFields()and selected a radio, wiping that selection.Adds
reapplyDonationAmtAfterSwap(), which subscribes once (via.one()) toonFrequencyChangeand, after a 200 ms settle delay, re-clicks the correctdonationAmtradio (or fills the Other text input for custom amounts). The handler fires only on the initial frequency load and never again, so it does not interfere with subsequent donor interactions.Changed Files
src/remember-me.tsDonationFrequencysrc/interfaces/options.tsfieldClearLabel?,encryptData?,hide?, andfieldDonationRecurrFreqRadioName?dist/remember-me.js/dist/remember-me.d.tsdist/interfaces/options.d.tsreference-materials/docs/rememberme.mdencryptData