Skip to content

Conversation

@bcarthic
Copy link
Collaborator

@bcarthic bcarthic commented May 5, 2018

Pull request checklist

Description of changes

The Breadcrumb component renders the divider to the last item when overflow index is set to the last item. Also the divider is not rendered next to the normal item for the case A > ...

In the first scenario, we don't check last index when rendering overflow item
In second scenario, we need to allow to render divider if there is a overflow item.

This change checks for those values and renders it correctly

image

to

image

@dzearing Could you take a look

@dzearing
Copy link
Member

dzearing commented May 6, 2018

resetting the build to see if something hiccup'd with screener.

@dzearing dzearing closed this May 6, 2018
@dzearing dzearing reopened this May 6, 2018
<li className={ this._classNames.listItem } key={ item.key || String(index) }>
{ onRenderItem(item, this._onRenderItem) }
{ index !== lastItemIndex && (
{ (index !== lastItemIndex || (hasOverflowItems && index === overflowIndex! - 1)) && (
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mind adding some parenthesis to ensure your booleans are evaluating what to expect?

&& index === (overflowIndex - 1)

Also you shouldn't need to add a ! after overflowIndex; should it default to a value? Or should you check for undefined?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We have the overflowIndex as default props but the default props is not working with optional props. Compiler complains Object is possibly 'undefined'

@JasonGore JasonGore merged commit 3ba4f92 into microsoft:master May 7, 2018
cliffkoh pushed a commit that referenced this pull request May 8, 2018
Markionium added a commit to Markionium/office-ui-fabric-react that referenced this pull request May 13, 2018
* master: (52 commits)
  Marqueeselection style update (microsoft#4803)
  Applying package updates.
  FocusZone: Add the ability to stop focus from propagating outside the FocusZone (microsoft#4823)
  Unknown persona coin (microsoft#4809)
  Applying package updates.
  BaseButton: Allow Alt + Down on menu buttons to open the menu (microsoft#4807)
  Applying package updates.
  Website: Scroll to top of page on navigation (microsoft#4810)
  Applying package updates.
  ActivityItem: fix getstyles (microsoft#4802)
  Mark Slider#ValuePosition enum as deprecated as it is unused. (microsoft#4799)
  Icon: ensure `styles` still works. (microsoft#4805)
  Popup: Added check for onBlur to prevent focus setting focus to be incorrectly disabled when closing a menu in Chrome (microsoft#4804)
  Update package.json
  Move <Layer> to use React portals when available (microsoft#4724)
  Fix breadcrumb rendering issue when overflow item is at last index  (microsoft#4787)
  Fixes focus issue for contextual menus (microsoft#4744)
  Remove redundant selected items prop on BaseExtendedPicker (microsoft#4769)
  SearchBox: New prop for turning off icon animation (microsoft#4794)
  Add functions to ContextualMenuItem to open and close menus on command (microsoft#4741)
  ...
@microsoft microsoft locked as resolved and limited conversation to collaborators Aug 31, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Breadcrumb renders divider incorrectly when overflow item is at last index

3 participants