Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Follow up on remaining Lumina migration notes #10731

Open
1 of 5 tasks
jcfranco opened this issue Nov 15, 2024 · 2 comments
Open
1 of 5 tasks

Follow up on remaining Lumina migration notes #10731

jcfranco opened this issue Nov 15, 2024 · 2 comments
Assignees
Labels
2 - in development Issues that are actively being worked on. calcite-components Issues specific to the @esri/calcite-components package. estimate - 5 A few days of work, definitely requires updates to tests. p - medium Issue is non core or affecting less that 60% of people using the library refactor Issues tied to code that needs to be significantly reworked.

Comments

@jcfranco
Copy link
Member

jcfranco commented Nov 15, 2024

Description

In addition to the migration notes added by #10310, the following should be addressed as well:

Stabilize

☑️ – no longer shows up

@esri/calcite-components:test:  FAIL  src/components/combobox/combobox.e2e.ts > calcite-combobox > reflects > %p scale
@esri/calcite-components:test: Error: vitest-fail-on-console > Expected test not to call console.error().
@esri/calcite-components:test:     If the error is expected, test for it explicitly by mocking it out using: 
@esri/calcite-components:test:     vi.spyOn(console, 'error').mockImplementation(() => {}) 
@esri/calcite-components:test:     and test that the warning occurs.
@esri/calcite-components:test: 
@esri/calcite-components:test: "chevronDown16" is not a valid calcite-ui-icon name 
@esri/calcite-components:test: Stack:
@esri/calcite-components:test:   http://localhost:5173/src/components/icon/utils.ts:23:14
@esri/calcite-components:test: 
@esri/calcite-components:test:     at Console.l [as error] (file:///home/runner/work/calcite-design-system/calcite-design-system/node_modules/vitest-fail-on-console/src/index.ts:90:31)
@esri/calcite-components:test:     at ae (file:///home/runner/work/calcite-design-system/calcite-design-system/node_modules/@arcgis/lumina-compiler/dist/puppeteerTesting/index.js:2:1926)
@esri/calcite-components:test:  ❯ Console.l [as error] ../../node_modules/vitest-fail-on-console/src/index.ts:90

✅ – #10818

@esri/calcite-components:test: 
@esri/calcite-components:test:  FAIL  src/components/segmented-control/segmented-control.e2e.ts > calcite-segmented-control > when multiple items are checked, last one wins
@esri/calcite-components:test: AssertionError: expected '1' to be '3' // Object.is equality
@esri/calcite-components:test: 
@esri/calcite-components:test: Expected: "3"
@esri/calcite-components:test: Received: "1"

Proposed Advantages

Cleaner, simpler code.

Which Component

N/A

Relevant Info

No response

Calcite package

  • @esri/calcite-components
  • @esri/calcite-components-react
  • @esri/calcite-design-tokens
  • @esri/calcite-ui-icons
  • @esri/eslint-plugin-calcite-components
@jcfranco jcfranco added refactor Issues tied to code that needs to be significantly reworked. 1 - assigned Issues that are assigned to a sprint and a team member. p - medium Issue is non core or affecting less that 60% of people using the library estimate - 5 A few days of work, definitely requires updates to tests. labels Nov 15, 2024
@jcfranco jcfranco added this to the 2024-12-17 - Dec Milestone milestone Nov 15, 2024
@jcfranco jcfranco self-assigned this Nov 15, 2024
@github-actions github-actions bot added the calcite-components Issues specific to the @esri/calcite-components package. label Nov 15, 2024
jcfranco added a commit that referenced this issue Dec 4, 2024
…10952)

**Related Issue:** #10731

## Summary

Tweaks initialization logic to prevent extraneous change event that
happened after #10310.
@geospatialem
Copy link
Member

geospatialem commented Dec 4, 2024

Similar to the segmented-control timings, there may be some similar behavior occurring with the list component. A few notes below (also in our internal migration notes and feedback issue) for consideration:

  • list's calciteListChange event payload for it's selectedItems provides two values (old and new) when the selectionMode is in "single" or "single-persist": https://codepen.io/geospatialem/pen/PwYPgrO
  • list's initial rendering doesn't provide the list-item's node (it isn't ready)

Wondering if we should consider a more comprehensive testing approach to determine if there are other components with selected and checked that may also be impacted cc @driskull potential list below

  • card
  • carousel-item
  • checkbox
  • chip
  • date-picker-day
  • dropdown-item
  • flow-item
  • handle
  • list-item
  • radio-button
  • segmented-control-item
  • stepper-item
  • switch
  • tab
  • tab-title
  • table-row
  • tile
  • tile-select
  • tip
  • tree-item

@ellenupp
Copy link

dialog is raising a close event while initializing-

When creating a dialog with open, after its first willUpdate, open is true but opened is false. When it goes to render its panel it sets the panel’s closed to !opened. The panel has the default closed=false, so in its willUpdate it calls close() since the dialog set closed=true. This is a problem because we use beforeClose to dismiss the panel, removing it from the dom, so the open dialog never renders.

Repro codepen

cc @driskull

jcfranco added a commit that referenced this issue Dec 12, 2024
…nitialization (#11038)

**Related Issue:** #10731 

## Summary

`willUpdate` was invoking toggling logic that was meant to be called
after initialization (compare with [Stencil
version](https://github.com/Esri/calcite-design-system/blame/bcc19be314a45ff584793e473e5851e15cefa83f/packages/calcite-components/src/components/panel/panel.tsx#L92)).
driskull added a commit that referenced this issue Dec 16, 2024
…ent is hidden (#11056)

**Related Issue:** #10731

## Summary

This will address the following Chrome console error caused by using the
`ariaHidden` prop (after #10310):

> Blocked aria-hidden on an element because its descendant retained
focus. The focus must not be hidden from assistive technology users.
Avoid using aria-hidden on a focused element or its ancestor. Consider
using the inert attribute instead, which will also prevent focus. For
more details, see the aria-hidden section of the WAI-ARIA specification
at https://w3c.github.io/aria/#aria-hidden.
Element with focus: span
Ancestor with aria-hidden: <calcite-popover
reference-element=​"reference-element" placement=​"auto"
offset-distance=​"6" offset-skidding=​"0" text-close=​"Close"
aria-hidden=​"true" aria-live=​"polite"
id=​"calcite-popover-a872ffbb-85e1-5c2c-6f14-8108c4821728"
role=​"dialog" overlay-positioning=​"absolute" scale=​"m"
calcite-hydrated>​…​</calcite-popover>​#shadow-root (open)<div
style=​"width:​ 300px;​ padding:​12px
16px;​">​…​</div>​slot</calcite-popover>

BEGIN_COMMIT_OVERRIDE
END_COMMIT_OVERRIDE
driskull added a commit that referenced this issue Dec 16, 2024
driskull added a commit that referenced this issue Dec 16, 2024
… present and item count is one (#11073)

**Related Issue:** #10731

## Summary

- disable drag handle when a single item is in the list and the list has
nowhere else to move to
- add e2e
- add story


BEGIN_COMMIT_OVERRIDE
END_COMMIT_OVERRIDE
jcfranco added a commit that referenced this issue Dec 16, 2024
**Related Issue:** #10731 

## Summary

Fixes a text width logic issue where
[`font`](https://developer.mozilla.org/en-US/docs/Web/CSS/font) would be
empty instead of the expected shorthand value.

This also moves the text-width calculation logic to a
`requestAnimationFrame` callback to improve timing and performance.

BEGIN_COMMIT_OVERRIDE
END_COMMIT_OVERRIDE
jcfranco added a commit that referenced this issue Dec 16, 2024
…on outside click (#11058)

**Related Issue:** #10731 

## Summary

This addresses an issue where focus-trapping components were
unintentionally modified by
#9231 to block
interaction/focusing via outside clicks.
jcfranco added a commit that referenced this issue Dec 17, 2024
…er state is updated (#11079)

**Related Issue:** #10731 

## Summary

Changes `calcite-list` and `calcite-list-item` to wait for their update
to be complete before emitting the change and selection events.
jcfranco added a commit that referenced this issue Dec 23, 2024
)

**Related Issue:** #10731

## Summary

Adds a guard to `popover` and `tooltip` `ref` callbacks to avoid missing
ref warnings on removal. After #10310, `ref` callbacks are invoked both
when the component is added and removed (see
#11093).

BEGIN_COMMIT_OVERRIDE
omitted from changelog
END_COMMIT_OVERRIDE
jcfranco added a commit that referenced this issue Dec 23, 2024
…11139)

**Related Issue:** #10731 

## Summary

Fixes a regression caused by #10310 where the change to the internal
popover to use `triggerDisabled` would no longer work when the component
was reconnected.
jcfranco added a commit that referenced this issue Jan 7, 2025
**Related Issue:** #11217 #10731

## Summary

Removes unintentional `@readonly` on `readOnly` prop. 

For context, with #10310 any props with the `@readonly` tag will be made
read-only.
jcfranco added a commit that referenced this issue Jan 7, 2025
…ions.json` (#11219)

**Related Issue:** #10731

## Summary

Updates `generateT9nDocsJSON.ts` to reference the updated translations
bundle file name (see
#11054).
jcfranco added a commit that referenced this issue Jan 7, 2025
**Related Issue:** #10731

## Summary

Adds package export to support doc-related ESM imports.
jcfranco added a commit that referenced this issue Jan 11, 2025
**Related Issue:** #10731  

## Summary  

#10952 increased the
frequency of `combobox`'s item-updating logic.

This improves performance by:  

* reducing the number of initial item update calls  
* debouncing the item update function to the next tick
@jcfranco jcfranco added 2 - in development Issues that are actively being worked on. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Jan 11, 2025
jcfranco added a commit that referenced this issue Jan 14, 2025
**Related Issue:** #10731 

## Summary

Uses pseudo-element + CSS logical property placement to ensure the
selection indicator is consistently positioned, regardless of page
direction.

BEGIN_COMMIT_OVERRIDE
omitted from changelog
END_COMMIT_OVERRIDE

---------

Co-authored-by: Blake Stearman <bstearman@esri.com>
jcfranco added a commit that referenced this issue Jan 20, 2025
)

**Related Issue:** #10731  

## Summary  

Fixes a combobox regression introduced by
#11265 without
impacting performance.

### Notable changes

* drops debouncing of
  * item update (initial update delay was the main cause of regression)
  * change event emitting
* adds more test coverage for change event emitting
* ignores item-initiated updates until combobox is loaded
* splits up item update logic into the following sections to minimize
re-renders:
  * item/data
  * item props
  * selection/filter
  * minor tidy up
jcfranco added a commit that referenced this issue Jan 22, 2025
… format (#11351)

**Related Issue:** #10731  

## Summary  

Adds missing check to skip internal, equal values after transitioning to
getters/setters in #10310.
jcfranco added a commit that referenced this issue Jan 23, 2025
…ipping (#11373)

**Related Issue:** #10731 

## Summary

Removes legacy `position: relative` to reduce chance of clipping (see
https://floating-ui.com/docs/misc#clipping).

BEGIN_COMMIT_OVERRIDE
omitted from changelog
END_COMMIT_OVERRIDE
jcfranco added a commit that referenced this issue Jan 25, 2025
**Related Issue:** #10731 

## Summary

Fixes prop update delays introduced in #10310 by moving event emitting
to Lit's [pre-update
phase](https://lit.dev/docs/components/lifecycle/#reactive-update-cycle).
jcfranco added a commit that referenced this issue Jan 28, 2025
**Related Issue:** #10731  

## Summary  

✨🚸☑️🔨✨ 

@driskull Thanks for the patch!

---------

Co-authored-by: Matt Driscoll <MDriscoll@esri.com>
jcfranco added a commit that referenced this issue Jan 29, 2025
)

**Related Issue:** #10731, #11382

## Summary

This updates the combobox internal state after an custom item is added.

**Note**: this also adds `createEventTimePropValuesAsserter` to help
assert on event-emit time component state.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
2 - in development Issues that are actively being worked on. calcite-components Issues specific to the @esri/calcite-components package. estimate - 5 A few days of work, definitely requires updates to tests. p - medium Issue is non core or affecting less that 60% of people using the library refactor Issues tied to code that needs to be significantly reworked.
Projects
None yet
Development

No branches or pull requests

3 participants