Conversation
Temporary Branch UpdateThe temporary branch has been updated with the latest changes. Below are the details:
Please use the above install command to update to the latest version. |
[Beta] Generated file diffTime updated: Thu, 12 Feb 2026 12:48:18 GMT Integration
File has changed Windows
File has changed New Files
❌ File only exists in new changeset |
special-pages/pages/new-tab/app/next-steps-list/next-steps-list.md
Outdated
Show resolved
Hide resolved
01b0753 to
ddea04c
Compare
|
@alistairjcbrown This is working great for me with the macOS integration 🎉 If this isn't merged today, could we update the branch with the latest from |
ddea04c to
2c5ae0c
Compare
✅ Deploy Preview for content-scope-scripts ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
special-pages/pages/new-tab/app/next-steps-list/next-steps-list.service.js
Show resolved
Hide resolved
vkraucunas
left a comment
There was a problem hiding this comment.
@alistairjcbrown looks pretty good! Just a few things:
- Please add the new testing params to the guide in
special-pages/pages/new-tab/readme.md, I find it’s helpful to have them all in one place - The dismiss animation feels a little off. You can see the text of the current card and next one simultaneously. Maybe fade the text of the dismissing card faster and just leave the bg/or fade in the text of the next card on an ever so slight delay?
- I’ve challenged the seed/count indicator design in your project thread. It just doesn’t seem right.
- Perhaps feed the PNGs thru tinypng.com. These don’t need to be 30-60KB files.
|
Thanks @vkraucunas
|
…3216) <!-- Note: This template is a reminder of our Engineering Expectations and Definition of Done. Remove sections that don't apply to your changes.⚠️ If you're an external contributor, please file an issue before working on a PR. Discussing your changes beforehand will help ensure they align with our roadmap and that your time is well spent. --> Task/Issue URL: https://app.asana.com/1/137249556945/project/1209825025475019/task/1212879065365448?focus=true Tech Design URL: https://app.asana.com/1/137249556945/project/1209825025475019/task/1212359353583683?focus=true ### Description This integrates the new Next Steps frontend widget, including a couple improvements to the card behavior in the new widget: 1. Updates the feature flag name to `nextStepsListWidget` (to match the new FE widget name and sync with Windows). 2. Enables the new "Next Steps" widget on the New Tab Page when the feature flag is enabled. 3. Updates the "Personalize Your Browser" card behavior: The card provider now observes the relevant setting, so when the call to action is clicked the card is dismissed. 4. Updates the "Add to Dock" card behavior: When the app is successfully added to the dock, it refreshes the card list so the card is dismissed.⚠️ Testing these changes requires pointing the C-S-S dependency to a build including the unreleased frontend changes from duckduckgo/content-scope-scripts#2170. ### Testing Steps <!-- Assume the reviewer is unfamiliar with this part of the app --> 1. Check out the branch `rachel/frontend-integration-updates-testing` or update the BSK `Package.swift` file in this branch with this change (this adds the required frontend changes): ```diff - .package(url: "https://github.com/duckduckgo/content-scope-scripts.git", exact: "12.30.0"), + .package(url: "https://github.com/duckduckgo/content-scope-scripts.git", branch: "rachelmcr/next-steps-list-testing"), ``` 2. Build and run the app. 3. Go to Debug → Feature Flag Overrides → Other → enable `nextStepsListWidget`. 4. Go to Debug → New Tab Page → Reset Next Steps. 5. Confirm the new tab page shows the new Next Steps widget (without the production Next Steps widget). 6. On the "Personalize" card, click "Personalize Now." Confirm the card is dismissed when the Customize panel opens. 7. Click "Maybe Later" on each card to proceed to the "Add to Dock" card. 8. Click "Add to Dock" and confirm the card is dismissed when the app is successfully added to the dock. 9. Go to Debug → Feature Flag Overrides → Other → disable `nextStepsListWidget`. Confirm the production Next Steps widget is shown and the new Next Steps widget is hidden. <!-- ### Testability Challenges If you encountered issues writing tests due to any class in the codebase, please report it in the [Testability Challenges Document](https://app.asana.com/1/137249556945/project/1204186595873227/task/1211703869786699) 1. **Check the Document:** First, check the **Testability Challenges Table** to see if the class you encountered is listed. 10. **If the Class Exists:** - Update the **Encounter Count** by increasing it by 1. 11. **If the Class Does Not Exist:** - Add a new entry --> ### Impact and Risks <!-- What's the impact on users if something goes wrong? High: Could affect user privacy, lose user data, break core functionality Medium: Could disrupt specific features or user flows Low: Minor visual changes, small bug fixes, improvement to existing features None: Internal tooling, documentation --> Low: Minor visual changes, small bug fixes, improvement to existing features #### What could go wrong? <!-- Describe specific scenarios and how you've addressed them --> Changes are feature-flagged (internal only) and tested. ### Quality Considerations <!-- Focus on what matters for your changes: - What edge cases exist? - How does this affect performance? - What monitoring have you added? - What documentation needs updating? - How does this impact privacy/security? --> ### Notes to Reviewer <!-- Anything specific you want reviewers to focus on --> New Next Steps widget: <img width="551" height="253" alt="NextStepsListWidget" src="https://github.com/user-attachments/assets/76ef5928-8f07-423e-8b18-970922950268" /> --- ###### Internal references: [Definition of Done](https://app.asana.com/0/1202500774821704/1207634633537039/f) | [Engineering Expectations](https://app.asana.com/0/59792373528535/199064865822552) | [Tech Design Template](https://app.asana.com/0/59792373528535/184709971311943) <!-- CURSOR_SUMMARY --> --- > [!NOTE] > Enables the new Next Steps list widget for internal/flagged users and aligns app state with the new frontend widget. > > - Introduces `FeatureFlag.nextStepsListWidget` (renaming from `nextStepsSingleCardIteration`) and wires availability throughout providers > - Switches between legacy and single-card providers in `NewTabPageNextStepsCardsProviderFacade` based on the flag > - `NewTabPageConfigurationClient`: returns `nextStepsList` widget when available; adds `isNextStepsListWidgetAvailable` to availability API; adds new `WidgetId.nextStepsList` > - `NewTabPageNextStepsCardsActionHandler`: now depends on `FeatureFlagger`; after successful Dock add, refreshes cards when the flag is on > - `NewTabPageNextStepsSingleCardProvider`: observes `appearancePreferences.didOpenCustomizationSettings` to refresh/dismiss the Personalize card; generalizes visibility observer > - `AppearancePreferences`: replaces method with `@Published didOpenCustomizationSettings` persisted via persistor; navigator sets this on opening customization > - Debug reset updated to clear `didOpenCustomizationSettings`; tests added/updated to cover new flag, widget selection, and Dock/Personalize behaviors > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 2f5e582. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup> <!-- /CURSOR_SUMMARY -->
noisysocks
left a comment
There was a problem hiding this comment.
Code is looking good! Nice work.
Did you test in macOS and Windows to check that these changes are feature flagged and the existing next steps widget works?
We have relatively new screenshot tests for the new tab page. Consider updating them to cover the new next steps widget when the design is fairly finalised.
special-pages/pages/new-tab/app/next-steps-list/nextstepslist.data.js
Outdated
Show resolved
Hide resolved
special-pages/pages/new-tab/app/next-steps-list/components/NextStepsListCard.js
Show resolved
Hide resolved
special-pages/pages/new-tab/app/next-steps-list/components/NextStepsListCard.js
Outdated
Show resolved
Hide resolved
special-pages/pages/new-tab/app/next-steps-list/components/NextStepsListCard.js
Outdated
Show resolved
Hide resolved
special-pages/pages/new-tab/app/next-steps-list/components/NextStepsListCard.js
Outdated
Show resolved
Hide resolved
special-pages/pages/new-tab/app/next-steps-list/components/NextStepsListCard.module.css
Show resolved
Hide resolved
special-pages/pages/new-tab/app/next-steps-list/integration-tests/next-steps-list.spec.js
Outdated
Show resolved
Hide resolved
special-pages/pages/new-tab/app/next-steps-list/next-steps-list.service.js
Show resolved
Hide resolved
428ce65 to
df1cd73
Compare
Asana Task/Github Issue: https://app.asana.com/1/137249556945/project/1209272520346004/task/1212281179682493?focus=true
Description
Based heavily on Next Steps widget, adds a new Next Steps List widget with progress marker
To do:
Testing Steps
Checklist
Please tick all that apply:
Note
Medium Risk
Introduces a new widget UI path plus changes to shared Next Steps mock/message plumbing and locale strings, which could affect widget ordering and test/mocked behaviors. No auth/security or persistent data model changes beyond existing localStorage-backed mocks.
Overview
Adds a new New Tab Page widget,
nextStepsList, that reuses the existingnextSteps_*messaging but presents steps as a single card with a stacked “next” preview (including animations, theme-aware images, and localized strings).Updates integration/test infrastructure to support
next-steps-listURL params, insert thenextStepsListwidget into mockedinitialSetup, and add Playwright coverage (behavior + screenshots). Also hardens Next Steps rendering by filtering unknown IDs, adjusts related copy (Email Protection + Duck Player button text), and expands lint ignores for generatedSources/ContentScopeScripts/dist.Written by Cursor Bugbot for commit df1cd73. This will update automatically on new commits. Configure here.