Skip to content

Conversation

@aminland
Copy link
Owner

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

  1. Fork the repo and create your branch from master.
  2. If you've added code that should be tested, add tests!
  3. If you've changed APIs, update the documentation.
  4. Ensure that:
  • The test suite passes (npm test)
  • Your code lints (npm run lint) and passes Flow (npm run flow)
  • You have followed the testing guidelines
  1. If you haven't already, complete the CLA.

Please use the simple form below as a guideline for describing your pull request.

Thanks for contributing to Draft.js!

Summary

[...]

Test Plan

[...]

@aminland aminland merged this pull request into aminland:master Mar 13, 2018
aminland added a commit that referenced this pull request Mar 13, 2018
* Modified compositoin mode event handlers to provide better support for mobile browsers

* Added test cases for DraftEditorCompositionHandler

* Linter compliance

* Added support for `compositionupdate` event.

* Made the linter happy!

* Normalize beforeInput and compositionUpdate data

This continues from
facebookarchive#1152 and
facebookarchive#1285
making them work together for broad support for polatform
inconsistencies.

* Put new composition fixes behind a feature flag

* lint

* correct resets

* Fix Synthetic Event flow types

* Convert DraftEditorCompositionHandler tests to root tests + snapshots

* Remove unnecessary DraftFeatureFlags
aminland pushed a commit that referenced this pull request May 27, 2018
Summary:
**tldr;** Handlers can get called after cWU and before cDU, and they use the
cached 'latestEditorState'. For them to get the fresh version of the state,
we need to update 'latestEditorState' in 'render' because that happens before
the handlers get called.

**The whole story;**
We are trying to remove cWU from `DraftEditor.react.js`. One thing which
currently happens there is that `latestEditorState` gets set to the
nextProps.editorState, so whatever is passed in by the parent. For more context
on the initial attempt at changing this, see
https://our.intern.facebook.com/intern/diff/D6873303/

This change introduced one bug that manifested in various ways - see T26034821
and T26020049. I'll focus on T26020049, which broke
`<AdsBulkTokenizedTextInputWithFieldsSelector>`.

`<AdsBulkTok...FieldsSelection>` has a button for adding a new token, and when
you hit that button it passes `<DraftEditor>` an updated editorState as a prop.
This triggers render #1, and during that render we update the browser
selection, which triggers `focus` and `blur` events. These each trigger another
render of `<DraftEditor>`; renders #2 and facebookarchive#3. Here is how it looks on a
timeline:
```
render #1
+
|
| cWU -> latestEditorState = FRESH_STATE
|
| render -> this.props.editorState = FRESH_STATE
| +
| |
| +--> triggers 'focus' event, calling 'handleFocus' with latestEditorState
|                   +
|                   |
+>cDU fires         | the 'handleFocus' call schedules render #2
                    | with latestEditorState, which is FRESH_STATE
                    |
render #2  <--------+
+
|
| cWU -> latestEditorState = FRESH_STATE
|
| render -> this.props.editorState = FRESH_STATE
|
+>cDU fires
```
When we move the update of latestEditorState to cDM, things go awry like this;
```
render #1
+
|
| cWU -> Nothing ... latestEditorState = STALE_STATE :(
|
| render -> this.props.editorState = FRESH_STATE
| +
| |
| +--> triggers 'focus' event, calling 'handleFocus' with latestEditorState
|                                                +
|                                                |
+>cDU -> latestEditorState = FRESH_STATE         | the 'handleFocus' call schedules render #2
                                                 | with latestEditorState, which is STALE_STATE :(
                                                 |
render #2 <--------------------------------------+
+
|
| cWU -> nothing updates
|
| render -> this.props.editorState = STALE_STATE :(  because this was passed in above
|
+>cDU fires and resets latestEditorState = STALE_STATE :(
```

So we can fix things by updating latestEditorState inside the `render` method,
like so;
```
render #1
+
|
| cWU -> Nothing ... latestEditorState = STALE_STATE :(
|
| render -> this.props.editorState = FRESH_STATE
| +         *and* set latestEditorState = FRESH_STATE
  |
| |
| +--> triggers 'focus' event, calling 'handleFocus' with latestEditorState
|                                                +
|                                                |
+>cDU -> latestEditorState = FRESH_STATE         | the 'handleFocus' call schedules render #2
                                                 | with latestEditorState, which is FRESH_STATE
                                                 |
render #2 <--------------------------------------+
+
|
| cWU -> nothing updates
|
| render -> this.props.editorState = FRESH_STATE which was passed in above
|
+>cDU fires and resets latestEditorState = FRESH_STATE
```

One possible issue would be if `render` fired and then was never completed, in
async. mode, but since Draft is intended to always be run in sync. mode I'm not
worried about that.

Reviewed By: mitermayer

Differential Revision: D6994261

fbshipit-source-id: 80986b853a57f64aa5aafbe667b4d94171d5271c
aminland pushed a commit that referenced this pull request May 27, 2018
aminland pushed a commit that referenced this pull request May 27, 2018
Summary:
This PR continues facebookarchive#1607 (by aadsm) to update the website to https://github.com/facebook/docusaurus.

Changes from the original PR:
* Removing the `./setup.sh` line in .travis.yml (since the file was removed).
* Upgrading to the latest Docusaurus and React.
* Adding Google Analytics to Docusaurus config.
* Adding cname to Docusaurus config.
* Wiring the correct footer links.

Live Example: https://noamelb.github.io/draft-js/

Thanks flarnie & yangshun for all the help ☺️

![screencapture-localhost-3000-2018-05-10-23_18_05](https://user-images.githubusercontent.com/7422547/39892600-d14dc6be-54a9-11e8-953e-51be1cf48637.png)
![screencapture-localhost-3000-docs-getting-started-html-2018-05-10-23_18_26](https://user-images.githubusercontent.com/7422547/39892604-d3d9bdac-54a9-11e8-8306-e878775c1f79.png)
<img width="1055" alt="ga" src="https://user-images.githubusercontent.com/7422547/39892610-d6dc2c7e-54a9-11e8-8f58-9d256d2247ee.png">

Co-authored-by: António Afonso <[email protected]>
Closes facebookarchive#1759

Reviewed By: flarnie

Differential Revision: D8026140

Pulled By: flarnie

fbshipit-source-id: 975fcde309a8ab24af90c5363acf1b601dfdcde7
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants