profile
viewpoint

microsoft/fluentui 9922

Fluent UI web represents a collection of utilities, React components, and web components for building web applications.

ejlayne/component 0

Component

ejlayne/discussions-and-proposals 0

Discussions and proposal related to the main React Native project

ejlayne/ejthoughts 0

Personal Website

ejlayne/fluentui 0

We've moved! UI Fabric is now Fluent UI - A set of React components for building Microsoft web experiences.

ejlayne/fluentui-react-native 0

A react-native control library aligned with office-ui-fabric-react

ejlayne/react-native 0

A framework for building native apps with React.

issue commentmicrosoft/fluentui

Picker not announcing placeholder text when items selected

Yes, that is expected. Tab brings you to the list, then the left/right arrow keys move through it. Sorry for not mentioning that.

This should help: picker-keyboard

alexwaibel

comment created time in 2 hours

issue commentmicrosoft/fluentui

Pivot: all PivotItems render always (alwaysRender broken)

Hmm, that is strange. Can you share a CodePen with that behavior?

As long as the calls are inside the render path, they shouldn't be called. Perhaps something is being called on component creation?

OneCyrus

comment created time in 2 hours

issue commentmicrosoft/fluentui

DetailsList ARIA attributes are not allowed

@sereymonyros thanks for filing this

Confirmed repro. Here's an isolated codepen: https://codepen.io/justslone-the-encoder/pen/vYXGJPM

So, this one is a bit complicated. In this case DetailsList is behaving more as a treegrid, and actually the absence of being able to use aria-setsize and aria-posinset was an omission from the ARIA 1.1 spec. See this issue for more info

Actually if you try out accessibility insights on the official treegrid examples it raises the same issues. https://www.w3.org/TR/wai-aria-practices-1.1/examples/treegrid/treegrid-1.html image

So, I'm tempted to say this is expected and OK, however, my one reservation is that DetailsList, even though it's behaving like a treegrid, is actually role="grid".

@smhigley, You've had some thoughts or perspective on DetailsList's confused nature here, what are your thoughts on this issue?

sereymonyros

comment created time in 2 hours

issue commentmicrosoft/fluentui

Unable to style tooltip in CommandBar

@davallen thanks for reaching out! Can you share a CodePen/CodeSandbox showing the code you have, there might be a way to accomplish the styling you want. Without seeing the code and repro using Fluent UI React controls, it's hard to figure out what will fix it though.

davallen

comment created time in 3 hours

issue commentmicrosoft/fluentui

TextField tests created with use of @testing-library/react are failing after upgrade to office-ui-fabric-react v7.25.0

@WojciechKulpa thanks for the issue! I took a look and confirmed the repro, the CodeSandbox was super helpful thank you!

This is issue is really strange, however it doesn't seem to be a regression from v7.24.0 I updated the CodeSandbox to v7.24.0 and I still saw the issue.

I also created a further isolated sandbox that continues to repro the issue: https://codesandbox.io/s/laughing-river-cx9qo?file=/src/form.js

This is going to need further investigation.

WojciechKulpa

comment created time in 3 hours

issue commentmicrosoft/react-native-windows

E2E test: Clicking on hyperlinks crashes test app

The inlines that are involved in the links are created outside react native, they're created in code by the C# app directly, so they will not have RNW tags. The RNW should be resilient to dealing with elements not created by the framework as apps can mix and match XAML and RNW content

kmelmon

comment created time in 4 hours

issue commentmicrosoft/fluentui

Narrator is not announcing tooltip value when navigating in bar charts

@luckyrass thanks for the issue! Confirmed repro, the CodeSandbox made it super fast, thank you so much!

Found the issue in the DOM structure. the aria-lablledby value is "callout0", but the actual callout id is "toolTipcallout0". I manually edited the DOM and confirmed that resulted in narrator reading the tooltip image

@luckyrass if you are interested in making a fix here, it is probably straightforward. Otherwise I've sent this over to @Raghurk for consideration

luckyrass

comment created time in 4 hours

issue commentmicrosoft/fluentui

Commandbar menu items appear as normal text in high contrast mode

@Leiquan-Pan thanks for filing this issue, but I'm not seeing repro on a CodePen here. There might be some styles on the website referenced above that are causing the

Here's the codepen: image

Here's the website: image

Leiquan-Pan

comment created time in 4 hours

issue openedmicrosoft/react-native-windows

JsUpToDateCheck created at the root of the drive

Creating directory "\JsUpToDateCheck\vnext\node_modules\ws". Copying file from "D:\a\1\s\packages\react-native-windows-init\package.json" to "D:\JsUpToDateCheck\packages\react-native-windows-init\package.json.dummy". Copying file from "D:\a\1\s\vnext\package.json" to "D:\JsUpToDateCheck\vnext\package.json.dummy". Copying file from "D:\a\1\s\vnext\node_modules\ws\package.json" to "D:\JsUpToDateCheck\vnext\node_modules\ws\package.json.dummy". Creating directory "\JsUpToDateCheck\vnext\src\babel-plugin-codegen". Copying file from "D:\a\1\s\vnext\src\babel-plugin-codegen\package.json" to "D:\JsUpToDateCheck\vnext\src\babel-plugin-codegen\package.json.dummy". Touching "\JsUpToDateCheck\yarn.lock.dummy". Touching "\JsUpToDateCheck\package.json.dummy". Touching "\JsUpToDateCheck\packages@react-native-windows\cli\node_modules\xmldom\package.json.dummy". Touching "\JsUpToDateCheck\packages@react-native-windows\cli\package.json.dummy". Touching "\JsUpToDateCheck\packages@react-native-windows\cli\src\e2etest\projects\BarPackage\package.json.dummy". Touching "\JsUpToDateCheck\packages@react-native-windows\cli\src\e2etest\projects\FooPackage\pa

created time in 4 hours

issue commentmicrosoft/fluentui

<DetailsList

@sereymonyros thanks for filing this issue! I confirmed that narrator does not read the expand/collapsed state of the expand collapse group. I also updated the issue with a specific codepen, in the future please provide a codepen repro with issues you file. Also a gif showing the behavior is very helpful.

On this issue itself, this looks like an issue specific to narrator. NVDA successfully reads the expand/collapse state. Also I confirmed that the element is using aria-expanded=true/false, so this one might be difficult to fix, it might be an issue in narrator. See this example with NVDA: details-expand-nvda

I welcome anyone who wants to dig in and see if there is a way we can fix this for narrator.

sereymonyros

comment created time in 4 hours

issue openedmicrosoft/react-native-windows

Could not copy package.json.dummy in CI

Lots of FS contention in CI runs:

##[warning]Directory.Build.targets(43,5): Warning MSB3026: Could not copy "C:\a\1\s\packages\react-native-platform-override\node_modules\braces\package.json" to "C:\a\1\s\\vnext\\build\JsUpToDateCheck\packages\react-native-platform-override\node_modules\braces\package.json.dummy". Beginning retry 1 in 1000ms. The process cannot access the file 'C:\a\1\s\\vnext\\build\JsUpToDateCheck\packages\react-native-platform-override\node_modules\braces\package.json.dummy' because it is being used by another process. 

https://dev.azure.com/ms/react-native-windows/_build/results?buildId=126324&view=logs&j=1e181896-1839-5e51-5c05-797b2ae792b3&t=c5fa9d7c-258b-5c3a-dd65-f3b6426ffcc4&l=2551

created time in 4 hours

issue commentmicrosoft/fluentui

WinUI Acrylic material for Fluent UI React

@SFM61319 thanks for the proposal, Acrylic isn't in our plans right now, but there is a long term goal of alignment between the various Fluent UI platforms. I'll talk to folks and see what we want to do here. Unfortunately with holidays it probably won't be until January next year.

Also, I'd recommend checking out our new model for constructing components. you can see it done with button here: https://github.com/microsoft/fluentui/tree/master/packages/react-button/src/components/Button

It's still in preview, but should be fairly stable soon, in particular useButtonClasses will likely change a bit in the near future.

SFM61319

comment created time in 5 hours

issue commentmicrosoft/fluentui

Pivot: all PivotItems render always (alwaysRender broken)

actually we hit this issue with components inside the pivotitem. e.g. we have apollo queries inside the pivotitems and all requests fire at the same time. something seems to be strange here.

OneCyrus

comment created time in 5 hours

issue commentmicrosoft/fluentui

Date picker icon and dropdown icon are not properly aligned

@lennertVanSever yep, that's definitely not aligned! Thanks for raising this

I'll reach out to our designers to get a sense for which icon/direction we think we should adjust. This will be a little lower priority and unfortunately would churn a lot of existing UI. We will probably look to fix this in a future design refresh.

lennertVanSever

comment created time in 5 hours

issue commentmicrosoft/fluentui

Pivot: all PivotItems render always (alwaysRender broken)

@OneCyrus thanks for reaching out!

Actually it looks like this is due to how react evaluates statements inside {}. It's evaluating that statement as part of creating the PivotItem element. Passing it into PivotItem as children, so it gets run before PivotItem is called.

However, since react components turn into a call to React.createElement, this doesn't happen for components. So the components in-fact are not getting rendered. We can confirm this by adding a simple <Logger> component to the example that performs the console.log on render. Here's an example: 16126 - example - PivotItem logging

To demonstrate this with code: Basically this JSX

<PivotItem headerText="Recent" itemKey="recent" alwaysRender={false}>
   {console.log("Immedite #2")}
   <Logger text="Recent" />
   <Label styles={labelStyles}>Pivot #2</Label>
</PivotItem>

turns into this JavaScript

React.createElement(
PivotItem, { headerText: "Recent", itemKey: "recent", alwaysRender: false },
   console.log("Immedite #2"),
   React.createElement(Logger, { text: "Recent" }),
   React.createElement(Label, { styles: labelStyles }, "Pivot #2")
)

I hope this answers your question!

OneCyrus

comment created time in 6 hours

issue commentmicrosoft/fluentui

ActionButton label doesn't use disabled text color in high contrast mode

@molinger thanks for the issue! Confirmed the repro, updated the issue with a isolated CodePen.

Looks like the issue is here: the disabled color for action button is specified here but there is no high contrast selector. https://github.com/microsoft/fluentui/blob/9c92b506d8139d1ab596caaec276774d9ae27b81/packages/react-internal/src/compat/components/Button/ActionButton/ActionButton.styles.ts#L47-L51

See this line for the default button styles: https://github.com/microsoft/fluentui/blob/9c92b506d8139d1ab596caaec276774d9ae27b81/packages/react-internal/src/compat/components/Button/ButtonThemes.ts#L64-L72

It seems like adding a HighContrastSelector and just setting color: 'GrayText', should be sufficient to fix this issue.

@molinger are you interested in spinning up a PR and giving a go at fixing this issue?

molinger

comment created time in 7 hours

issue commentmicrosoft/fluentui

Line chart: Not able to focus all the points in chart, while using browse mode in NVDA

@jameelakowsar, can you provide a CodePen and some repro steps? It will help fix the issue.

@Raghurk, FYI on this issue in charting

jameelakowsar

comment created time in 7 hours

issue commentmicrosoft/electionguard-python

Discrete Log needs a Cutoff

Also affected, just had to reboot :joy:

However I did not change suppress_validity_check, can you confirm it reproduces with the latest release of electionguard-python with this script ? https://github.com/jpic/electionguard-blowup

danwallach

comment created time in 8 hours

issue commentmicrosoft/react-native-windows

Error: Unable to resolve module `./debugger-ui/ui.e31bb0bc.js` from ``: ./debugger-ui/ui.e31bb0bc.js could not be found within the project.

yeah. there's some sort of network error, but I can't diagnose it because of the debugger error. and clearing my browser cache didn't help. I deleted node_modules and yarn lock (you can see from pushes), yet the issue remains so I don't understand what is wrong. I have setup a proxy server for the URL and set mode: 'cors', so i'm not sure why the fetch is giving an error.

goatandsheep

comment created time in 8 hours

issue openedmicrosoft/react-native-windows

useWindowDimensions hook always returns fixed values

<!-- Your issue will be triaged by the RNW team according to this process: https://github.com/microsoft/react-native-windows/wiki/Triage-Process -->

Environment

Run the following in your terminal and copy the results here.

  1. npx react-native --version: 4.13.1
  2. npx react-native info: System: OS: Windows 10 10.0.18363 CPU: (12) x64 Intel(R) Core(TM) i7-6850K CPU @ 3.60GHz Memory: 24.39 GB / 47.91 GB Binaries: Node: 12.9.1 - C:\Program Files\nodejs\node.EXE Yarn: 1.22.4 - C:\Program Files (x86)\Yarn\bin\yarn.CMD npm: 6.10.2 - C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: Not Found Windows SDK: AllowDevelopmentWithoutDevLicense: Enabled AllowAllTrustedApps: Enabled Versions: 10.0.18362.0 IDEs: Android Studio: Not Found Visual Studio: 16.8.30711.63 (Visual Studio Professional 2019), 15.9.28307.344 (Visual Studio Community 2017) Languages: Java: Not Found Python: 3.8.6 npmPackages: @react-native-community/cli: ^4.13.1 => 4.13.1 react: 16.13.1 => 16.13.1 react-native: 0.63.3 => 0.63.3 react-native-windows: ^0.63.0-0 => 0.63.11 npmGlobalPackages: react-native: Not Found

<!-- Consider including this information as well: What SDK version are you building for?

  • Target Platform Version(s): 10.0.18362 What device(s) are you targeting?
  • Target Device(s): Desktop Which version of Visual Studio are you using?
  • Visual Studio Version: Visual Studio 2019 Which build configuration are you running?
  • Build Configuration: Debug -->

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

  1. Create RN App and use UseWindowDimensions hook
import { Text, View, useWindowDimensions } from 'react-native';

const App = () => {
    const dimensions = useWindowDimensions()
    console.log(dimensions.width)
    console.log(dimensions.height)

    return (
            <View>
                <Header />
                <LoginComponent />
                <View style={{flex: 1, flexDirection: 'row'}}>
                    <SideMenu />
                    <MainBody />
                </View>
            </View>
    )
}
  1. Resize application window. Logged dimensions are always 1200 for width and 900 for height, regardless of actual window size.

Expected Results

Dimesnions would update as window size changes.

<!-- Troubleshooting If you see build failure on react-native run-windows, please try again with 'react-native run-windows --logging' and provide the output. -->

Snack, code example, screenshot, or link to a repository:

Please provide a Snack (https://snack.expo.io/), a link to a repository on GitHub, or provide a minimal code example that reproduces the problem. You may provide a screenshot of the application if you think it is relevant to your bug report. Here are some tips for providing a minimal example: https://stackoverflow.com/help/mcve

created time in 12 hours

issue commentOfficeDev/office-js

Outlook-OWA not displaying email properly when email headers are sent.

This is not an add-in specific issue. We will route this issue to Outlook team internally.

glr0221

comment created time in 13 hours

issue commentOfficeDev/office-js

New Outlook for Mac does not show Custom Categories

Can you share the version of Outlook Mac? We can route this to the Outlook team internally.

Byron-Mo

comment created time in 13 hours

issue commentOfficeDev/office-js

Office.context.mailbox.item.recurrence.getAsync is not getting the recurrence of event

We are unable to repro the issue locally. Screenshot

We followed the below steps:

  1. Open Outlook Web on Chrome
  2. Create a new calendar event
  3. Open Script Lab add-in and import https://gist.github.com/iuri1994/6f315f98a9281339e8e2fef534074860
  4. Change the recurrence of the meeting
  5. Wait for recurrence properties from handler
  6. Click Run to fetch recurrence properties using Recurrence API.

Can you share the steps you followed? Does this occur on other Outlook clients (Outlook Desktop, Outlook Mac, Outlook Online (OWA) on other browsers) ?

iuri1994

comment created time in 13 hours

issue openedmicrosoft/fluentui

Combobox scrollSelectedToTop does not work, after type in the option, it did not scroll to top.

Environment Information

  • Package version(s): "office-ui-fabric-react": "^7.153.4",
  • Browser and OS versions: Chrome Version 87.0.4280.67 (Official Build) (x86_64)

Please provide a reproduction of the bug in a codepen:

https://codesandbox.io/s/crimson-mountain-ucujb?file=/src/App.js

Actual behavior:

Set scrollSelectedToTop to true. After typing the option, scrollbar did not move.

Expected behavior:

scrollbar should scroll to top.

Priorities and help requested:

Are you willing to submit a PR to fix? (Yes, No)

Requested priority: (Blocking )

created time in 14 hours

issue openedmicrosoft/react-native-windows

Bundling should not re-run when no changes to JS files

react-native bundle should collect a list of the JS files it traversed and that list fed into the MakeBundle inputs so that we can skip bundling when there are no JS changes

created time in 15 hours

issue openedmicrosoft/react-native-windows

Cannot build release e2eTest in Visual Studio

In VS, OutDir is a relative path for C# projects, e.g. bin\x86\Release

    <BundleSourceMapDir Condition="'$(BundleSourceMapDir)' == ''">$([MSBuild]::NormalizePath('$(OutDir)\sourcemaps\react'))</BundleSourceMapDir>

Therefore BundleSourceMapDir ends up wrongly pointing under the VS install dir

created time in 15 hours

issue closedmicrosoft/fluentui

IDropdownStyles not working, it gets overwritten

Environment Information

  • Package version(s): latest

Please provide a reproduction of the bug in a codepen:

https://codepen.io/rafaelki/pen/KKgdPOj

Actual behavior:

The width of the callout passed in the "styles" property gets overwritten, so there is not way to set the width of the callout to 'auto' in order to display long options.

Expected behavior:

I would expect that the properties that I pass to the component take effect, overwritting the default behaviour.

Priorities and help requested:

Are you willing to submit a PR to fix? No

Requested priority: Normal

closed time in 16 hours

Rafaelki

issue commentmicrosoft/fluentui

IDropdownStyles not working, it gets overwritten

Thank you very much @JustSlone

Rafaelki

comment created time in 16 hours

push eventmicrosoft/react-native-windows

Vladimir Morozov

commit sha 932eb5f017589480d6848e58b689d43ee12bef87

Fix destruction of UIManager in UI thread (#6680) * Fix destruction of UIManager in UI thread * Change files

view details

push time in 19 hours

PR merged microsoft/react-native-windows

Reviewers
Fix destruction of UIManager in UI thread AutoMerge Backport to 0.63 Approved Request Backport to 0.64

This PR is to augment the fix in PR #6321 where we wanted to make that the UIManager is destroyed from UI thread. We are still getting reports that code crashes because the UIManager is destroyed in a background thread. It happens because in the code below the m_uiQueue is already stopped and as a result we still destroy the UIManager in a BG thread instead of UI queue.

m_uiQueue->runOnQueue([manager = std::move(m_manager)]() {});

To address this issue we must take the underlying DispatchQueue which is not affected by the MessageQueueThread stop condition and use it to destroy the UIManager:

std::static_pointer_cast<Mso::React::MessageDispatchQueue>(m_uiQueue)
    ->DispatchQueue()
    .Post([manager = std::move(m_manager)]() noexcept {});

The fix must be propagated back to 0.63 to unblock our customers.

Microsoft Reviewers: Open in CodeFlow
+13 -1

2 comments

2 changed files

vmoroz

pr closed time in 19 hours

more