[TextField] Fix enter behavior with multiline when controlled

[sajal50]

Fixes #6990

• PR has tests / docs demo, and is linted.
• Commit and PR titles begin with [ComponentName], and are in imperative form: "[Component] Fix leaky abstraction".
• Description explains the issue / use-case resolved, and auto-closes the related issue(s) (http://tr.im/vFqem).

[oliviertassinari]

Would if (!this.props.value)) { be enough?

[sajal50]

But, if the value is set as a falsy value, for example "" (an empty string), then if (!this.props.value) { wouldn't work.

[oliviertassinari]

Should good then!

[oliviertassinari]

A small unit test would make this PR perfect, otherwise, the logic looks good to me 👍 . We might need to port it back to the next branch as might be affected by the same issue.

[sajal50]

I have just started learning the testing frameworks mentioned [here] (https://github.com/callemall/material-ui/blob/master/test/README.md). Hoping to add a unit test soon.

I've also started going through the next branch codebase. Will update there as well soon.

[sajal50]

  it('does not change the height of text area', (done) => {
    const wrapper = mountWithContext(
      <TextField
        onChange={() => {
          const newHTML = wrapper.find('textarea').at(1).html();
          assert.strictEqual(newHTML, initialHTML, 'should not change the height of the text area');
          done();
        }}
        value="some value"
        id="unique"
        multiLine={true}
      />
    );

    const initialHTML = wrapper.find('textarea').at(1).html();
    wrapper.find('textarea').at(1).simulate('change', {target: {value: '\n'}});
  });

@oliviertassinari How does this look for a unit test? Since, there is not a good API in enzyme to extract the current style instance, this unit test validates the HTML instance itself.

[oliviertassinari]

@sajal50 I would use the .find() API to target the right element. Then use .props().style to get the style and finally use an assertion with the expected value. Does that help?

[sajal50]

Thank you for your help, @oliviertassinari. For some reason, .props() method wasn't working on a native HTML element, such as <textarea>, before. It works now. I have pushed the unit test.

[oliviertassinari]

@sajal50 Thanks, I have removed that test as wasn't properly testing the behavior (it's green on master without the fix). Testing that part is hard without the test infrastructure we have on the next branch, so going to merge without 👍 .

[neemah]

Can't wait release with this one! :)

[oliviertassinari]

@neemah It's done.