profile
viewpoint
Sophie Alpert sophiebits Humu California https://sophiebits.com/ I like fixing things. eng at humu! former eng manager of @reactjs at Facebook. ex-@khanacademy. 💎🌸 she/her. kindness, intersectional feminism, music.

facebook/react 159970

A declarative, efficient, and flexible JavaScript library for building user interfaces.

jonschlinkert/remarkable 4948

Markdown parser, done right. Commonmark support, extensions, syntax plugins, high speed - all in one. Gulp and metalsmith plugins available. Used by Facebook, Docusaurus and many others! Use https://github.com/breakdance/breakdance for HTML-to-markdown conversion. Use https://github.com/jonschlinkert/markdown-toc to generate a table of contents.

reactjs/rfcs 2952

RFCs for changes to React

sindresorhus/object-assign 871

ES2015 Object.assign() ponyfill

kentcdodds/modern-react 210

workshop about React's hottest new features in 16.7.0

sophiebits/adventofcode 21

Advent of Code Solutions

bvaughn/react 14

A declarative, efficient, and flexible JavaScript library for building user interfaces.

HCSSiM/yp17 5

HCSSiM style for LaTeX

kamens/khan-exercises 4

A framework for building exercises to work with Khan Academy.

pull request commentfacebook/react

Disable console.logs in the second render pass of DEV mode double render

My underlying issue is that I had some other render side-effects that I thought were idempotent (useRef) but turns out not -- and the first instinct to pull out console.log made me super confused.

As always in software, there's the possibility of making this configurable, perhaps opt-out with a small start-up warning message letting people know it's a thing? I mean, the double-render behaviour is mentioned in the docs but I'm pretty sure many people miss it.

Yes the double render behavior is mentioned. But the console suppression isn’t.

sebmarkbage

comment created time in 20 minutes

Pull request review commentfacebook/react

[Flight] Add getCacheForType() to the dispatcher

 const Dispatcher: DispatcherType = {   useTransition(): [(callback: () => void) => void, boolean] {     return [() => {}, false];   },+  getCacheForType<T>(resourceType: () => T): T {+    invariant(+      currentCache,+      'Reading the cache is only supported while rendering.',+    );+    if (currentCache.has(resourceType)) {

Yea that's why I did it. I guess we could warn on undefined.

gaearon

comment created time in 23 minutes

issue commentfacebook/react

Bug: React hijacks console functions that may cause unpredictable behavior.

This is intended behavior (introduced in #18547) that will be opt-out once #19710 lands in React devtools. Until then you can use a local workaround explained in #20090 (comment).

But that is bad—It’s been tripping users up like what have been posted in comments on the original pull request:

  • https://github.com/facebook/react/pull/18547#issuecomment-720493759
  • https://github.com/facebook/react/pull/18547#issuecomment-726866607

At least, were the console suppression to be kept, it should be explicitly stated in the documentation.

infinnie

comment created time in 33 minutes

pull request commentfacebook/react-native

PermissionsAndroid: Request permission only when response from rationale is positive

@Bhavik-P, I think this PR is yet to be merged because of the failed tests. Would you mind going through it please?

@klazbaba I don't think the failed tests have anything to do with this PR. If you know someone that can review my code changes and get this through the official pipeline for the upcoming release it would be great. We currently have a patch with this PR and had it in production since I made this PR.

Bhavik-P

comment created time in an hour

pull request commentfacebook/react

Remove unused bundles

I think it does apply here because they way you build modern is with RELEASE_CHANNEL=experimental yarn build (which happens to be the default).

rickhanlonii

comment created time in an hour

push eventfacebook/react-native

Héctor Ramos

commit sha 5eee2f2bc01184481a663453648ab15d1d295f4d

Fix Circle CI iOS Tests: Make FBReactNativeSpec dir as needed Summary: Quick fix for Circle CI: Ensure FBReactNativeSpec dir exists before touching files. Changelog: [Internal] Reviewed By: fkgozali Differential Revision: D25285573 fbshipit-source-id: 8dec496856c90accc687648d7068aadfea24d72b

view details

push time in an hour

pull request commentfacebook/react

Remove unused bundles

The experimental !== modern thing is a separate issue that this doesn’t address. Our @gate experimental check is subtly wrong for the same reason.

rickhanlonii

comment created time in an hour

pull request commentfacebook/react

Remove unused bundles

Yeah I like the API of listing out every combination; I just don’t like how scattershot the implementation is later when we infer things about the underlying dimensions. It’d be cool we if we that in one place, immediately when we consume the bundle. Best of both worlds.

rickhanlonii

comment created time in an hour

pull request commentfacebook/react

Remove unused bundles

The RELEASE_CHANNEL flag makes most sense for open source. EXPERIMENTAL != MODERN and that keeps tripping me up. Especially for esoteric things like the Webpack plugin. I'm also not sure it actually works for those. Like what happens if we publish the Webpack package today in experimental? What tag will it get?

rickhanlonii

comment created time in an hour

pull request commentfacebook/react

Remove unused bundles

fwiw. I really like this change because it lists out every combination. It's so easy to understand.

The combinatorial thing makes you think about combinations that don't make sense.

rickhanlonii

comment created time in an hour

pull request commentfacebook/react

Remove unused bundles

I should be able to land most of the first commit without any issue, let me update.

rickhanlonii

comment created time in an hour

pull request commentfacebook/react

Remove unused bundles

Yeah, agreed. Re: complexity - one reason I liked this approach more is that the implementation was cleaner even though there's more bundle config. There's effectively three lines that change in the actual build script (I hear you though).

rickhanlonii

comment created time in an hour

pull request commentfacebook/react

Remove unused bundles

Yes, that's currently a file that needs to be removed while keeping the others.

CircleCI has a "matrix builds" feature that lets you exclude certain combinations. https://circleci.com/docs/2.0/configuration-reference/#excluding-sets-of-parameters-from-a-matrix. I suppose we could do something similar.

I do like the explicitness of listing out every combination for every bundle. (I can't even remember what the moduleType option means :D)

But I guess I was hoping that this would be as small a change as possible, given that our build script is so complex already.

should we bail out of this strategy and just add a filter to the sync?

Yeah probably. Getting too bikesheddy. One day we'll redo this whole pipeline from scratch and we can make it better then.

rickhanlonii

comment created time in an hour

pull request commentfacebook/react

Remove unused bundles

Is that actually a valid use case?

Yes, that's currently a file that needs to be removed while keeping the others.

rickhanlonii

comment created time in 2 hours

pull request commentfacebook/react

Remove unused bundles

There's a new problem where many of the files that we are skipping now have build tests that run on them, so it looks like we need to build them anyway? @acdlite should we bail out of this strategy and just add a filter to the sync?

rickhanlonii

comment created time in 2 hours

pull request commentfacebook/react

Remove unused bundles

How would you exclude ReactDOMServer-dev.modern.js while keeping ReactDOMServer-prod.modern.js and ReactDOMServer-dev.classic.js

Is that actually a valid use case?

A more realistic case that I think illustrates your point is that there's no such thing as a bundle that's both OSS_EXPERIMENTAL and FB_WWW_PROD. But I think that's fine; we'd just won't output combinations that don't make sense, like you already do here: https://github.com/facebook/react/pull/20369/files#diff-f05e9513ea1c7e83c66f63dc3a7a2e1d464c58c7beebe1c375a2845caa6b0bc4R776-R780

It may match more conceptually but without rewriting the entire config, I think it makes it harder to reason about what will be output based on a given config.

I agree that it's a bit harder to predict the final bundles — nothing's easier than listing out every single one in a flat list — but it makes the implementation harder to maintain, and encourages weird ad hoc workarounds like this isFBBundle check:

https://github.com/facebook/react/blob/504222dcd21c7ac43eb78df11226bab47ec03bb0/scripts/rollup/build.js#L545-L558

That could check the release channel instead.

rickhanlonii

comment created time in 2 hours

pull request commentfacebook/react-native

Move hermes to a separate podspec

CI is failing for an unreleated reason now so it seems to work!

janicduplessis

comment created time in 2 hours

pull request commentfacebook/react-native

Fix use_framework RNTester crash

cc @alloy

janicduplessis

comment created time in 2 hours

PR opened facebook/react-native

Fix use_framework RNTester crash

Summary

When building RN Tester with use_frameworks it crashes on launch because of duplicate folly singletons. Seems that it is included twice because of Flipper. From what I understand flipper is not really compatible with use_frameworks so this removes it from that build variant. We also remove hardcoded SONARKIT defines in the xcodeproject, those will be added by the Flipper podspec anyway so it is not needed.

This then exposed a missing double conversion header error in Folly so this fixes the DoubleConversion podspec to add its headers path to the user project.

Changelog

[Internal] [Fixed] - Fix use_framework RNTester crash

Test Plan

Tested RN tester with use frameworks on and off. Also made sure flipper works still when frameworks is false.

+66 -88

0 comment

4 changed files

pr created time in 2 hours

pull request commentfacebook/react

Remove unused bundles

Interestingly, I'm now making the same argument @sebmarkbage was making against the test-cli options. I think the difference there is in the test CLI we can still list common combinations and if you use invalid combinations, we can show warnings. But in this config, you want to minimize the mental grepping you need to do to know what's being bundled.

rickhanlonii

comment created time in 3 hours

pull request commentfacebook/react

Remove unused bundles

I went that route initially but the combinations didn't make sense. E.g. what's an example of a NODE_DEV, FB_MODERN combination? Would you keep FB_WWW as a bundle type? How would you exclude ReactDOMServer-dev.modern.js while keeping ReactDOMServer-prod.modern.js and ReactDOMServer-dev.classic.js? It may match more conceptually but without rewriting the entire config, I think it makes it harder to reason about what will be output based on a given config.

rickhanlonii

comment created time in 3 hours

issue openedfacebook/react-native

After upgrade from React Native 0.60 to 0.63 Appium is no longer able to find buttons in UWP app

Please provide all the information requested. Issues that do not follow this format are likely to stall.

Description

I am working on test automation using Appium to test a native Windows UWP app that is written in Typescript with React-Native and then compiled into a Windows UWP app. We were previously using version 0.60 of React-Native and I had some test code working just fine with Appium, finding all controls in the app using the accessibilityId(s) without issue. After the developers updated to React-Native 0.63 some of this code has stopped working, as Appium is no longer able to find buttons (Next and Back specifically) within the app to be able to navigate pages. Just wondering if anyone else has seen this issue.

React Native version:

I don't have React-Native installed on my machine as I am not doing any development, only test automation. I am told by the devs though that we are only 0.63 now.

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

  1. As mentioned, this is using code (C# as well I have tried Typescript) running Appium code for test automation. The code was working fine before the upgrade to 0.63.

Expected Results

Was hoping the test automation code would keep working after the upgrade from 0.60 to 0.63.

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 3 hours

pull request commentfacebook/react-native

Integrate Native Module codegen into Xcode build pipeline

This pull request was successfully merged by @hramos in c901c1fbce080c6e9b6ed56dbccaa7f2fa0571b2.

<sup>When will my fix make it into a release? | Upcoming Releases</sup>

hramos

comment created time in 3 hours

push eventfacebook/react-native

Héctor Ramos

commit sha c901c1fbce080c6e9b6ed56dbccaa7f2fa0571b2

Integrate Native Module codegen into Xcode build pipeline (#30449) Summary: Move the codegen invocation out of Podfiles and into the FBReactNativeSpec Pod itself. With this change, developers do not need to modify their existing project's Podfiles, and yet the codegen will be integrated into their projects automatically by way of the FBReactNativeSpec Pod. This is accomplished in part by injecting a script build phase into the Pods Xcode project that is generated by CocoaPods. The build phase will save the output of the codegen script to a log in the derived files directory. The codegen will be executed if the codegen log file is not present, or if the contents of the Libraries directory has changed. The codegen will thus be invoked in these situations: **RNTester:** * When `packages/rn-tester/RNTesterPods.xcworkspace` is built, if the codegen output logfile is not present or if the input files have changed. **OSS React Native apps:** * When `ios/AwesomeProject.xcworkspace` is built, if the codegen output file is not present or if the input files have changed. Normally, this should not happen, as we do not expect folks to update the contents of `node_modules/react-native/Libraries`. Pull Request resolved: https://github.com/facebook/react-native/pull/30449 Changelog: [Internal] - Moved codegen invocation out of Podfile and into FBReactNativeSpec Pod Reviewed By: fkgozali Differential Revision: D25138896 fbshipit-source-id: 4779f822459cea2c30fd544eee19a49e8d80153d

view details

push time in 3 hours

PR closed facebook/react-native

Reviewers
Integrate Native Module codegen into Xcode build pipeline CLA Signed Partner fb-exported p: Facebook

Move the codegen invocation out of Podfiles and into the FBReactNativeSpec Pod itself. With this change, developers do not need to modify their existing project's Podfiles, and yet the codegen will be integrated into their projects automatically by way of the FBReactNativeSpec Pod.

This is accomplished in part by injecting a script build phase into the Pods Xcode project that is generated by CocoaPods. The build phase will be executed if the generated FBReactNativeSpec{.h, -generated.mm} files are not present, or if the contents of the Libraries directory has changed. The codegen is also triggered by pod install via prepare_command.

The codegen will thus be invoked in these situations:

RNTester:

  • When pod install is invoked in packages/rn-tester/ (prepare_command)
  • When packages/rn-tester/RNTesterPods.xcworkspace is built, if the output files are not present or if the input files have changed (script_phase).

OSS React Native apps:

  • When pod install is invoked in ios/ (prepare_command)
  • When ios/AwesomeProject.xcworkspace is built, if the output files are not present or if the input files have changed (script_phase).

Changelog: [Internal] - Moved codegen invocation out of Podfile and into FBReactNativeSpec Pod

Differential Revision: D25138896

+84 -64

9 comments

8 changed files

hramos

pr closed time in 3 hours

pull request commentfacebook/react-native

Move hermes to a separate podspec

Ok I managed to get everything working, the use_frameworks build is currently crashing at runtime because of duplicate Folly singleton. This is caused by Flipper, from what I understand it is not compatible with use_frameworks so I will open a separate PR to fix the use_frameworks build.

This moves the hermes executor to a new module reacthermes and use public_headers which seemed the less hacky solution to expose the module headers.

janicduplessis

comment created time in 3 hours

issue commentfacebook/react-native

App state does not show state going from 'background' to 'active'

Hey @jaworek, I've attached the link 4 months ago. It seems like you didn't check the link for the new code snippet reference. 😁

jaworek

comment created time in 3 hours

issue commentfacebook/react

16.8.6: Invariant Violation: Expected subtree parent to be a mounted class component

For those encountering this error in the context of AGGrid, it seems to be a bug on their part and was resolved in version 22.1.0 so you may want to consider upgrading. Specifically, it looks like multiple invocations of showNoRowsOverlay result in multiple overlays which triggers this React error. More info can be found here: https://github.com/ag-grid/ag-grid/issues/3450

MatthewHerbst

comment created time in 3 hours

push eventfacebook/draft-js

Travis CI

commit sha 6c6f30c19fe63bd96d60d7c4429565b8d7b93b4d

Deploy website - based on 288a094ed364ef240d11a4a7ea66b4ff8b73361d

view details

push time in 3 hours

PR closed facebook/react

Remove "redundant" return statement CLA Signed Component: DOM

As long as return doc.activeElement || doc.body; won't throws any error, try/catch is not necessary.

<!-- Thanks for submitting a pull request! We appreciate you spending the time to work on these changes. Please provide enough information so that others can review your pull request. The three fields below are mandatory.

Before submitting a pull request, please make sure the following is done:

  1. Fork the repository and create your branch from master.
  2. Run yarn in the repository root.
  3. If you've fixed a bug or added code that should be tested, add tests!
  4. Ensure the test suite passes (yarn test). Tip: yarn test --watch TestName is helpful in development.
  5. Run yarn test --prod to test in the production environment. It supports the same options as yarn test.
  6. If you need a debugger, run yarn debug-test --watch TestName, open chrome://inspect, and press "Inspect".
  7. Format your code with prettier (yarn prettier).
  8. Make sure your code lints (yarn lint). Tip: yarn linc to only check changed files.
  9. Run the Flow type checks (yarn flow).
  10. If you haven't already, complete the CLA.

Learn more about contributing: https://reactjs.org/docs/how-to-contribute.html -->

Summary

The expression return doc.activeElement || doc.body; won't produce any kind of exceptions the try/catch is not required, it is redundant.

<!-- Explain the motivation for making this change. What existing problem does the pull request solve? -->

Test Plan

<!-- Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes the user interface. -->

+1 -5

7 comments

1 changed file

juanarbol

pr closed time in 4 hours

more