Fluentui: All of sudden styles got changed for command bar

[ymihir]

I am using commandbar where I am getting borders for every command option from today. Yesterday Everything works fine. Any changes were added?

Below are dependencies in package.json:

"dependencies": {
    "@material-ui/core": "^4.5.1",
    "@material-ui/icons": "^4.5.1",
    "@microsoft/sp-core-library": "1.9.1",
    "@microsoft/sp-lodash-subset": "1.9.1",
    "@microsoft/sp-office-ui-fabric-core": "1.9.1",
    "@microsoft/sp-webpart-base": "1.9.1",
    "@pnp/common": "^1.3.6",
    "@pnp/logging": "^1.3.6",
    "@pnp/odata": "^1.3.6",
    "@pnp/sp": "^1.3.6",
    "@types/es6-promise": "0.0.33",
    "@types/react": "16.8.8",
    "@types/react-dom": "16.8.3",
    "@types/webpack-env": "1.13.1",
    "material-table": "^1.52.0",
    "office-ui-fabric-react": "6.189.2",
    "react": "16.8.5",
    "react-accessible-accordion": "^3.0.0",
    "react-dom": "16.8.5",
    "react-responsive-accordion": "^1.0.0",
    "toastr": "^2.1.4"
  }

[dzearing]

This is a needle in a haystack for us. You need to do investigation for your scenario here.

1. Inspect your scenario using browser dev tools. Find where the borders are being defined. Likely some other css in your app is targeting all buttons or something.

2. If you think it's Fabric, go to the doc site, find the landing page for the component, (https://developer.microsoft.com/en-us/fabric#/controls/web/commandbar), find a similar example, and click "Export to codepen".

3. In the codepen, adjust the code to fit your use case. You can also adjust the version of Fabric to your version by changing the unpkg.com url to your applicable version. In your case, I see 6.189.2, so:

1. Does it repro? Then log an issue and we can help investigate further and see if something was introduced. Otherwise there's not much we can do.

[msft-github-bot]

Thanks for taking the time to enter an issue. However, it seems that there aren't enough details here for this issue to be actionable.

When issues are created, we need details such as:

1. Which Fabric component and which version of the Fabric component is causing the issue
2. What behaviors and attributes are missing or incorrect
3. What you expected and what is actually happening
4. Confirmation that the problem reproduces in isolation

Without a clear understanding of these details, it's not possible to take clear action on issues. We are unable to meet your expectations, properly address the root cause, and make changes without affecting the expectations of other consumers.

Please provide these additional details as you are able. The default issue template provides an outline of these details and is viewable when creating a new issue. Additionally, if this is an accessibility issue, please see Accessibility Troubleshooting in our wiki for more guidance. If these details cannot be provided, please kindly close the bug.

Thank you for your patience.

[dzearing]

https://codepen.io/dzearing/pen/xxxQXVb Here's a codepen to start with, but I wanted to give those instructions above for future reference :)

[msft-github-bot]

This issue has been automatically marked as stale because it has marked as requiring actionable feedback but has not had any activity for 2 days. It will be closed if no further activity occurs within 3 days of this comment. Thank you for your contributions to Fabric React!

[SimSpfx]

Hello,

I had this issue too. Since i did not update any package or class, i think it is a sharepoint update. the border comes from the root class if you inspect the element.

Kind regards
Simon

[hamedy]

same here, haven't touched my solution and this morning got borders around CommandBarButton. a bit later they disappeared and now they are back!

[hamedy]

actually same thing is happening in SP online too.

[bva999]

I have same issue in SPO. Office UI Fabric version - 6.210.4


Version 7.61.1 works fine in another solution. Both solutions deployed in SPO...

[mfdezvil]

Same error in my SPO, I haven't touched anything on my solution and suddenly borders appeared in command bar buttons. I have Office UI Fabric version 6.191.0

[RoelVB]

I've started seeing this in multiple SPO tenants since last Friday. All using OfficeUI version 6.x.
First is was in both targeted and standard release tenants, but now it's only in standard release (targeted is fine now)

[msft-github-bot]

This issue has been automatically marked as stale because it has marked as requiring actionable feedback but has not had any activity for 2 days. It will be closed if no further activity occurs within 3 days of this comment. Thank you for your contributions to Fabric React!

[mfdezvil]

Hi, looks like its fixed now... at least for my tenants. Thanks.

[RoelVB]

I can confirm it is fixed now. Checked it on 3 different tenants.

[bva999]

Yes , fixed!

[msft-github-bot]

This issue has been automatically marked as stale because it has marked as requiring actionable feedback but has not had any activity for 2 days. It will be closed if no further activity occurs within 3 days of this comment. Thank you for your contributions to Fabric React!