diff --git a/change/react-native-windows-2019-10-14-11-29-13-autoCapital.json b/change/react-native-windows-2019-10-14-11-29-13-autoCapital.json
new file mode 100644
index 00000000000..d89fd99a9c0
--- /dev/null
+++ b/change/react-native-windows-2019-10-14-11-29-13-autoCapital.json
@@ -0,0 +1,9 @@
+{
+ "type": "prerelease",
+ "comment": "Support autoCapitalize Characters",
+ "packageName": "react-native-windows",
+ "email": "dida@ntdev.microsoft.com",
+ "commit": "ba8d6abb2b955bb89428fc717033cdb2af792837",
+ "date": "2019-10-14T18:29:13.893Z",
+ "file": "D:\\react2\\react-native-windows\\change\\react-native-windows-2019-10-14-11-29-13-autoCapital.json"
+}
\ No newline at end of file
diff --git a/packages/E2ETest/app/Consts.ts b/packages/E2ETest/app/Consts.ts
index f29d3cfc1a2..c6e0246d04a 100644
--- a/packages/E2ETest/app/Consts.ts
+++ b/packages/E2ETest/app/Consts.ts
@@ -14,6 +14,7 @@ export const TEXTINPUT_TESTPAGE = 'TextInputTestPage';
export const TEXTINPUT_ON_TEXTINPUT = 'TextInput';
export const PREVTEXT_ON_TEXTINPUT = 'PrevTextInput';
export const ML_TEXTINPUT_ON_TEXTINPUT = 'TextInputMultiLine';
+export const CAP_TEXTINPUT_ON_TEXTINPUT = 'TextInputAutoCap';
// LoginTestPage
export const LOGIN_TESTPAGE = 'LoginTestPage';
diff --git a/packages/E2ETest/app/TextInputTestPage.tsx b/packages/E2ETest/app/TextInputTestPage.tsx
index ffc92034ac6..f8b64e7a71b 100644
--- a/packages/E2ETest/app/TextInputTestPage.tsx
+++ b/packages/E2ETest/app/TextInputTestPage.tsx
@@ -6,7 +6,7 @@
import React from 'react';
import {Text, TextInput, View} from 'react-native';
-import {TEXTINPUT_ON_TEXTINPUT, ML_TEXTINPUT_ON_TEXTINPUT, PREVTEXT_ON_TEXTINPUT} from './Consts';
+import {TEXTINPUT_ON_TEXTINPUT, ML_TEXTINPUT_ON_TEXTINPUT, PREVTEXT_ON_TEXTINPUT, CAP_TEXTINPUT_ON_TEXTINPUT} from './Consts';
interface ITextInputTestPageState {
curText: string;
@@ -73,6 +73,12 @@ export class TextInputTestPage extends React.Component<
placeholder="MultiLine"
multiline={true}
/>
+
curText: {this.state.curText}
prev: {this.state.prevText}
diff --git a/packages/E2ETest/wdio/pages/TextInputTestPage.ts b/packages/E2ETest/wdio/pages/TextInputTestPage.ts
index f43ef9d9f75..72a38f00879 100644
--- a/packages/E2ETest/wdio/pages/TextInputTestPage.ts
+++ b/packages/E2ETest/wdio/pages/TextInputTestPage.ts
@@ -7,6 +7,7 @@ import { BasePage, By } from './BasePage';
import {
TEXTINPUT_ON_TEXTINPUT,
ML_TEXTINPUT_ON_TEXTINPUT,
+ CAP_TEXTINPUT_ON_TEXTINPUT,
PREVTEXT_ON_TEXTINPUT,
} from '../../app/Consts';
@@ -28,6 +29,10 @@ class TextInputTestPage extends BasePage {
this.multiLineTextInput.setValue(text);
}
+ clearAndTypeOnAutoCapTextInput(text: string) {
+ this.autoCapTextInput.setValue(text);
+ }
+
appendNewLineOnMLText(text: string) {
this.multiLineTextInput.addValue('End');
this.multiLineTextInput.addValue('Enter');
@@ -46,6 +51,10 @@ class TextInputTestPage extends BasePage {
return this.multiLineTextInput.getText();
}
+ getAutoCapTextInput() {
+ return this.autoCapTextInput.getText();
+ }
+
private get textInput() {
return By(TEXTINPUT_ON_TEXTINPUT);
}
@@ -57,6 +66,10 @@ class TextInputTestPage extends BasePage {
private get multiLineTextInput() {
return By(ML_TEXTINPUT_ON_TEXTINPUT);
}
+
+ private get autoCapTextInput() {
+ return By(CAP_TEXTINPUT_ON_TEXTINPUT);
+ }
}
export default new TextInputTestPage();
diff --git a/packages/E2ETest/wdio/test/testInput.spec.ts b/packages/E2ETest/wdio/test/testInput.spec.ts
index c6b71142ac7..170495522ea 100644
--- a/packages/E2ETest/wdio/test/testInput.spec.ts
+++ b/packages/E2ETest/wdio/test/testInput.spec.ts
@@ -23,6 +23,11 @@ describe('First', () => {
assert.equal(TextInputTestPage.getTextInputText(), 'def');
});
+ it('Type hello world on autoCap TextInput', () => {
+ TextInputTestPage.clearAndTypeOnAutoCapTextInput('hello world');
+ assert.equal(TextInputTestPage.getAutoCapTextInput(), 'HELLO WORLD');
+ });
+
it('Type abc on multiline TextInput then press Enter key', () => {
TextInputTestPage.clearAndEnterOnTextInput('abc');
assert.equal(
diff --git a/packages/playground/Samples/textinput.tsx b/packages/playground/Samples/textinput.tsx
index 5766d0c2a27..595cd757a39 100644
--- a/packages/playground/Samples/textinput.tsx
+++ b/packages/playground/Samples/textinput.tsx
@@ -56,6 +56,11 @@ export default class Bootstrap extends React.Component<{}, any> {
keyboardType="number-pad"
placeholder={'number-pad keyboardType'}
/>
+
()) {
+ if (propertyValue.isString()) {
+ if (propertyValue.asString() == "characters") {
+ textBox.CharacterCasing(winrt::CharacterCasing::Upper);
+ } else { // anything else turns off autoCap (should be "None" but
+ // we don't support "words"/"senetences" yet)
+ textBox.CharacterCasing(winrt::CharacterCasing::Normal);
+ }
+ } else if (propertyValue.isNull())
+ textBox.ClearValue(winrt::TextBox::CharacterCasingProperty());
+ }
}
} else { // Applicable properties for PasswordBox
if (propertyName == "text") {
@@ -628,7 +640,8 @@ folly::dynamic TextInputViewManager::GetNativeProps() const {
"selectTextOnFocus", "boolean")("spellCheck", "boolean")(
"text", "string")("mostRecentEventCount", "int")(
"secureTextEntry", "boolean")("keyboardType", "string")(
- "contextMenuHidden", "boolean")("caretHidden", "boolean"));
+ "contextMenuHidden", "boolean")("caretHidden", "boolean")(
+ "autoCapitalize", "string"));
return props;
}