901187442

pending completion

Build # 901187442

Build Type

Pull #3795

gitlab-ci

Committed by

mzedel

Commit Message

feat: increased chances of adopting our intended navigation patterns instead of unsupported browser navigation

Ticket: None
Changelog: None
Signed-off-by: Manuel Zedel <manuel.zedel@northern.tech>

Pull Request Pull Request #3795: feat: increased chances of adopting our intended navigation patterns instead of unsupported browser navigation

Run Details

4389 of 6365 branches covered (68.96%)

5 of 5 new or added lines in 1 file covered. (100.0%)

1729 existing lines in 165 files now uncovered.

8274 of 10019 relevant lines covered (82.58%)

144.86 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

93.94

/src/js/components/common/forms/textinput.js

// Copyright 2016 Northern.tech AS
//
//    Licensed under the Apache License, Version 2.0 (the "License");
//    you may not use this file except in compliance with the License.
//    You may obtain a copy of the License at
//
//        http://www.apache.org/licenses/LICENSE-2.0
//
//    Unless required by applicable law or agreed to in writing, software
//    distributed under the License is distributed on an "AS IS" BASIS,
//    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
//    See the License for the specific language governing permissions and
//    limitations under the License.
import React from 'react';

import { FormControl, FormHelperText, Input, InputLabel } from '@mui/material';

export default class TextInput extends React.Component {
  constructor(props, context) {
    super(props, context);
    this.state = {
      errortext: null,
      // the following is needed for the form validation to work if the field is not required
      isValid: true, // lgtm [js/react/unused-or-undefined-state-property]
      value: this.props.value || ''
    };
  }

  componentWillUnmount() {
    this.props.detachFromForm(this); // Detaching if unmounting
  }
  componentDidMount() {
    this.props.attachToForm(this); // Attaching the component to the form
    if (this.props.value) {
      this.props.validate(this, this.props.value);
    }
    if (this.props.setControlRef) {
      this.props.setControlRef(this.input);
    }
  }
  componentDidUpdate(prevProps) {
    if (this.props.focus) {
      this.input.focus();
    }
    var self = this;
    if (prevProps.value !== this.props.value) {
      this.setState({ value: this.props.value }, self.props.validate(self, self.props.value));
    }
  }

  setValue(event) {
    this.setState({
      value: event.currentTarget.value
    });
    this.props.validate(this, event.currentTarget.value);
  }
  render() {
    let { className = '' } = this.props;
    className = this.props.required ? `${className} required` : className;
    return (
      <FormControl className={className} error={Boolean(this.state.errortext)}>
        <InputLabel htmlFor={this.props.id} {...this.props.InputLabelProps}>
          {this.props.label}
        </InputLabel>
        <Input
          id={this.props.id}
          name={this.props.id}
          disabled={this.props.disabled}
          inputRef={input => (this.input = input)}
          value={this.state.value}
          onKeyPress={this.props.handleKeyPress}
          onChange={e => this.setValue(e)}
          placeholder={this.props.hint}
          required={this.props.required}
          style={{ width: '400px', maxWidth: '100%' }}
          type={this.props.type}
        />
        <FormHelperText id="component-error-text">{this.state.errortext}</FormHelperText>
      </FormControl>
    );
  }
}

1	// Copyright 2016 Northern.tech AS
2	//
3	// Licensed under the Apache License, Version 2.0 (the "License");
4	// you may not use this file except in compliance with the License.
5	// You may obtain a copy of the License at
6	//
7	// http://www.apache.org/licenses/LICENSE-2.0
8	//
9	// Unless required by applicable law or agreed to in writing, software
10	// distributed under the License is distributed on an "AS IS" BASIS,
11	// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12	// See the License for the specific language governing permissions and
13	// limitations under the License.
14	import React from 'react';
15
16	import { FormControl, FormHelperText, Input, InputLabel } from '@mui/material';
17
18	export default class TextInput extends React.Component {
19	constructor(props, context) {
20	super(props, context);	19✔
21	this.state = {	19✔
22	errortext: null,
23	// the following is needed for the form validation to work if the field is not required
24	isValid: true, // lgtm [js/react/unused-or-undefined-state-property]
25	value: this.props.value \|\| ''	37✔
26	};
27	}
28
29	componentWillUnmount() {
30	this.props.detachFromForm(this); // Detaching if unmounting	19✔
31	}
32	componentDidMount() {
33	this.props.attachToForm(this); // Attaching the component to the form	19✔
34	if (this.props.value) {	19✔
35	this.props.validate(this, this.props.value);	1✔
36	}
37	if (this.props.setControlRef) {	19✔
38	this.props.setControlRef(this.input);	1✔
39	}
40	}
41	componentDidUpdate(prevProps) {
42	if (this.props.focus) {	118✔
43	this.input.focus();	15✔
44	}
45	var self = this;	118✔
46	if (prevProps.value !== this.props.value) {	118!
UNCOV 47	this.setState({ value: this.props.value }, self.props.validate(self, self.props.value));	×
48	}
49	}
50
51	setValue(event) {
52	this.setState({	88✔
53	value: event.currentTarget.value
54	});
55	this.props.validate(this, event.currentTarget.value);	88✔
56	}
57	render() {
58	let { className = '' } = this.props;	137✔
59	className = this.props.required ? `${className} required` : className;	137✔
60	return (	137✔
61	<FormControl className={className} error={Boolean(this.state.errortext)}>
62	<InputLabel htmlFor={this.props.id} {...this.props.InputLabelProps}>
63	{this.props.label}
64	</InputLabel>
65	<Input
66	id={this.props.id}
67	name={this.props.id}
68	disabled={this.props.disabled}
69	inputRef={input => (this.input = input)}	274✔
70	value={this.state.value}
71	onKeyPress={this.props.handleKeyPress}
72	onChange={e => this.setValue(e)}	88✔
73	placeholder={this.props.hint}
74	required={this.props.required}
75	style={{ width: '400px', maxWidth: '100%' }}
76	type={this.props.type}
77	/>
78	<FormHelperText id="component-error-text">{this.state.errortext}</FormHelperText>
79	</FormControl>
80	);
81	}
82	}

mendersoftware / gui / 901187442

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous