Repository navigation
[SCF-2416] [Part 5] Replace ember-on-helper and ember-ref-bucket - #20
Open
Gaurav0 wants to merge 2 commits into
Conversation
ember-on-helper 0.1.0 depends on ember-cli-babel 7, and has had no release since 2019 and no commits since January 2020, so it can't be updated. Upstream ember-bootstrap still depends on it. The new bs-on-document and bs-on-window helpers share one classic Helper base class (utils/global-event-listener-helper). It adds the listener in compute, removes the previous one with the same options when the arguments change, and removes it in willDestroy. Named arguments such as capture=true are passed as listener options. ember-on-helper threw in FastBoot, which is why BsModal only rendered on-window outside of it. The base class skips targets without addEventListener (FastBoot's window has none), so that guard and the modal's isFastBoot field are gone. The FastBoot modal test covers it. Templates: bs-dropdown's three on-document calls and bs-modal's on-window call use the bs- helpers. Both are re-exported from app/, like bs-default. New tests: - both helpers: the callback fires, the listener is removed on teardown, and changing the event name or callback swaps it. capture=true catches events that stop propagation, and the capturing listener is removed with the same options. - BsModal: a window resize adjusts the dialog padding (adjustDialog had no coverage). - BsDropdown: once closed, outside clicks, Escape and Tab no longer call onHide. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
ember-ref-bucket 4.1.0 depends on ember-cli-babel 7. This ports upstream ember-bootstrap ember-bootstrap#2270 ("replace ember-ref-bucket with custom modifiers", by Sander Knauff, not yet released upstream) by hand, since upstream is now TypeScript in a monorepo. Each component that used @ref now has a plain field and a function-based modifier that sets it, built by the new addon/utils/track-element.js helper, e.g. trackMainNode = trackElement(this, '_element'); and its templates use {{this.trackMainNode}} instead of {{create-ref "mainNode"}} (19 sites). The names match upstream: trackMainNode, trackMenuElement, trackModalElement, trackBackdropElement, trackOverlayElement and trackPopperElement. Differences from upstream: - The modifiers come from one shared helper rather than being written out in each component. - trackElement passes { eager: false } to modifier(). ember-modifier 3.2.7 (the version partners uses) deprecates function-based modifiers without it, and setupNoDeprecations turns that into a test failure. 4.x ignores the option. - BsModal's modalElement is @Tracked. It is a dependency of the @computed scrollbarWidth, so a plain assignment on reopen would trip Ember's DEBUG mandatory-setter assertion. ref-bucket's untracked getter meant scrollbarWidth was never invalidated; now it is re-measured against the new element. - bs-form has no create-ref in this fork, so there is no trackFormElement. popperElement stays tracked (was @trackedRef), as upstream. The other fields were untracked getters before and are plain fields now; the classic components only read them from JS, so no set() is needed. The refs on child components (BsModal's dialog, the contextual-help overlay) still work because the modifier reaches the child's element through ...attributes. ember-ref-bucket's {{create-ref}} modifier leaked into apps as an implicit app/ export; it is gone now (release notes). New tests: - BsModal: after closing and reopening, the padding is measured against the new .modal element, on show and on resize. - BsPopover and BsTooltip, rendered in place with click triggers: clicking their own content doesn't close them (overlayElement via ...attributes), clicking the trigger does. All three fail with modalElement untracked or overlayElement unset. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This was referenced Nov 5, 2026
[SCF-2416] [Part 2] Upgrade test and lint tooling (ESLint 8, Prettier 3, ember-try 3, stylelint)
#17
Open
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
Both addons depend on ember-cli-babel 7. ember-on-helper is unmaintained, and ember-ref-bucket was replaced upstream too. This is the main code change in the stack.
bs-on-documentandbs-on-windowreplace ember-on-helper'son-document/on-window.addon/utils/global-event-listener-helper.js. It adds the listener incompute, swaps it when the arguments change, and removes it inwillDestroy.capture=truebecome listener options.addEventListenerare skipped, so BsModal's FastBoot guard andisFastBootfield are gone.app/.track*modifiers replace{{create-ref}}. This is a hand port of upstream replace ember-ref-bucket with custom modifiers ember-bootstrap/ember-bootstrap#2270 (unreleased upstream, by Sander Knauff).addon/utils/track-element.js, e.g.trackMainNode = trackElement(this, '_element').{ eager: false }avoids ember-modifier 3.2.7's deprecation.modalElementis@tracked, soscrollbarWidthis re-measured against a reopened modal's new element.+378/−58 lines, not counting
yarn.lock.New tests:
capture.Breaking changes (5.0.0 release notes)
{{create-ref}}is gone. It leaked into apps as an implicitapp/export of ember-ref-bucket. Apps that used it need to depend on ember-ref-bucket themselves.Stack
Part of the SCF-2416 work (ember-bootstrap 5.0.0), split from
scf-2416-reworkfor easier review. This is part 5 of 9. Stacked on Part 4: its base isgaurav/chore/SCF-2416-part-4-node-20-embroider-util-fork, so the diff only shows this part. Merge in order.Review notes
Review the two commits separately. The ref-bucket commit message lists every difference from upstream ember-bootstrap#2270 and why. The BsModal
@tracked modalElementchange is the subtlest: an untracked field would trip Ember's mandatory-setter assertion, because@computed scrollbarWidthdepends on it.Testing
Run on this branch with Node 20.19.6:
yarn install --frozen-lockfilepasses,yarn lintreports 0 errors (the same 150 warnings asscf_master), andember test(Ember 4.8, the default) has 550 passed, 9 skipped and 0 failed. +12 tests for the new helpers, BsModal, BsDropdown, BsPopover and BsTooltip. CI covers the ember-try matrix.🤖 Generated with Claude Code