[Android] beforeTextChange and textChange events fire when `autoCapitalize` property set

[ahmadov]

Problem description

When autoCapitalize property changes, beforeTextChange and textChange events fire.

If someone relies only on beforeTextChange event to sync the value of the text input then the user will never get notified with the new value but they will receive the old value.

This happens only on Android with Tabris 2.x but not with Tabris 3.x.

Expected behavior

Those events do not fire when autoCapitalize property changes.

Environment

• Tabris.js version: 2.x nightly
• Device: Samsung galaxy tab S3, Google Pixel 3
• OS: Android 9, 10

Code snippet

const { ui, TextInput } = require('tabris');

let myText = new TextInput({
  top: 200,
  left: '20%',
  right: '20%',
  height: 120,
  type: 'multiline',
  alignment: 'left'
});

myText.on('beforeTextChange', event => {
  console.log('new value:', event.newValue);
});

myText.on('textChanged', event => {
  console.log('text changed:', event.value);
});

ui.contentView.append(myText);

myText.set({ autoCapitalize: 'sentence' });

setTimeout(() => myText.text = 'Test', 100);

Output:

new value:
text changed:
new value:
text changed:
text changed: Test

[elshadsm]

@ahmadov thank you for reporting the issue. Before all to let you know that tabris 2.x uses old Android support libraries intended for 28 and lower versions. The issue is Android-specific and occurs when we update autoCapitalize after setting the beforeTextChange, textChanged, and input event handlers.

Since the issue is Android-specific and we use old support libraries in our 2.x branch, it is hard to introduce some solution in order to fix the issue that occurs with this scenario.

I would suggest setting autoCapitalize before setting the beforeTextChange, textChanged, and input event handlers or the best is to set the autoCapitalize in the TextInput constructor.