[MM-54858] Can't set 0 to a dialog element with subtype=number in interactive dialog (#24916)

* fix: avoid considering 0 as falsy value

* refactor: simplify value assertion

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
This commit is contained in:
Yusuke Nemoto 2023-10-17 19:57:03 +09:00 committed by GitHub
parent f44f4edd17
commit 654669aa00
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 40 additions and 4 deletions

View File

@ -33,6 +33,32 @@ describe('components/interactive_dialog/DialogElement', () => {
expect(wrapper.find(TextSetting).props().type).toEqual('text');
});
describe('subtype number', () => {
test('value is 0', () => {
const wrapper = shallow(
<DialogElement
{...baseDialogProps}
type='text'
subtype='number'
value={0}
/>,
);
expect(wrapper.find(TextSetting).props().value).toEqual(0);
});
test('value is 123', () => {
const wrapper = shallow(
<DialogElement
{...baseDialogProps}
type='text'
subtype='number'
value={123}
/>,
);
expect(wrapper.find(TextSetting).props().value).toEqual(123);
});
});
it('subtype email', () => {
const wrapper = shallow(
<DialogElement

View File

@ -39,7 +39,7 @@ export type Props = {
text: string;
value: string;
}>;
value?: string | boolean;
value?: string | number | boolean;
onChange: (name: string, selected: string) => void;
autoFocus?: boolean;
actions: {
@ -163,7 +163,13 @@ export default class DialogElement extends React.PureComponent<Props, State> {
textSettingMaxLength = maxLength || TEXTAREA_DEFAULT_MAX_LENGTH;
}
const textValue = value as string;
let assertedValue;
if (subtype === 'number' && typeof value === 'number') {
assertedValue = value as number;
} else {
assertedValue = value as string || '';
}
return (
<TextSetting
autoFocus={this.props.autoFocus}
@ -171,7 +177,7 @@ export default class DialogElement extends React.PureComponent<Props, State> {
type={subtype as InputTypes || 'text'}
label={displayNameContent}
maxLength={textSettingMaxLength}
value={textValue || ''}
value={assertedValue}
placeholder={placeholder}
helpText={helpTextContent}
onChange={onChange}

View File

@ -23,6 +23,10 @@ describe('integration utils', () => {
expect(checkDialogElementForError(TestHelper.getDialogElementMock({type: 'text', min_length: 5}), '123')!.id).toBe('interactive_dialog.error.too_short');
});
it('should return null on 0', () => {
expect(checkDialogElementForError(TestHelper.getDialogElementMock({type: 'text', subtype: 'number'}), 0)).toBe(null);
});
it('should return null on good number element', () => {
expect(checkDialogElementForError(TestHelper.getDialogElementMock({type: 'text', subtype: 'number'}), '123')).toBe(null);
});

View File

@ -9,7 +9,7 @@ type DialogError = {
values?: any;
};
export function checkDialogElementForError(elem: DialogElement, value: any): DialogError | undefined | null {
if (!value && !elem.optional) {
if ((!value && value !== 0) && !elem.optional) {
return {
id: 'interactive_dialog.error.required',
defaultMessage: 'This field is required.',