How to use createElementTypeChecker method in Playwright Internal

Best JavaScript code snippet using playwright-internal

Run Playwright Internal automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

CustomPropTypes.js

Source: CustomPropTypes.js Github

copy
1import React from 'react';
2
3const ANONYMOUS = '<<anonymous>>';
4
5const CustomPropTypes = {
6
7  isRequiredForA11y(propType){
8    return function(props, propName, componentName){
9      if (props[propName] === null) {
10        return new Error(
11          'The prop `' + propName + '` is required to make ' + componentName + ' accessible ' +
12            'for users using assistive technologies such as screen readers `'
13        );
14      }
15
16      return propType(props, propName, componentName);
17    };
18  },
19
20  /**
21   * Checks whether a prop provides a DOM element
22   *
23   * The element can be provided in two forms:
24   * - Directly passed
25   * - Or passed an object that has a `render` method
26   *
27   * @param props
28   * @param propName
29   * @param componentName
30   * @returns {Error|undefined}
31   */
32  mountable: createMountableChecker(),
33
34  /**
35   * Checks whether a prop provides a type of element.
36   *
37   * The type of element can be provided in two forms:
38   * - tag name (string)
39   * - a return value of React.createClass(...)
40   *
41   * @param props
42   * @param propName
43   * @param componentName
44   * @returns {Error|undefined}
45   */
46  elementType: createElementTypeChecker(),
47
48  /**
49   * Checks whether a prop matches a key of an associated object
50   *
51   * @param props
52   * @param propName
53   * @param componentName
54   * @returns {Error|undefined}
55   */
56  keyOf: createKeyOfChecker,
57  /**
58   * Checks if only one of the listed properties is in use. An error is given
59   * if multiple have a value
60   *
61   * @param props
62   * @param propName
63   * @param componentName
64   * @returns {Error|undefined}
65   */
66  singlePropFrom: createSinglePropFromChecker,
67
68  all
69};
70
71function errMsg(props, propName, componentName, msgContinuation) {
72  return `Invalid prop '${propName}' of value '${props[propName]}'` +
73    ` supplied to '${componentName}'${msgContinuation}`;
74}
75
76/**
77 * Create chain-able isRequired validator
78 *
79 * Largely copied directly from:
80 *  https://github.com/facebook/react/blob/0.11-stable/src/core/ReactPropTypes.js#L94
81 */
82function createChainableTypeChecker(validate) {
83  function checkType(isRequired, props, propName, componentName) {
84    componentName = componentName || ANONYMOUS;
85    if (props[propName] == null) {
86      if (isRequired) {
87        return new Error(
88          `Required prop '${propName}' was not specified in '${componentName}'.`
89        );
90      }
91    } else {
92      return validate(props, propName, componentName);
93    }
94  }
95
96  let chainedCheckType = checkType.bind(null, false);
97  chainedCheckType.isRequired = checkType.bind(null, true);
98
99  return chainedCheckType;
100}
101
102function createMountableChecker() {
103  function validate(props, propName, componentName) {
104    if (typeof props[propName] !== 'object' ||
105      typeof props[propName].render !== 'function' && props[propName].nodeType !== 1) {
106      return new Error(
107        errMsg(props, propName, componentName,
108          ', expected a DOM element or an object that has a `render` method')
109      );
110    }
111  }
112
113  return createChainableTypeChecker(validate);
114}
115
116function createKeyOfChecker(obj) {
117  function validate(props, propName, componentName) {
118    let propValue = props[propName];
119    if (!obj.hasOwnProperty(propValue)) {
120      let valuesString = JSON.stringify(Object.keys(obj));
121      return new Error(
122        errMsg(props, propName, componentName, `, expected one of ${valuesString}.`)
123      );
124    }
125  }
126  return createChainableTypeChecker(validate);
127}
128
129function createSinglePropFromChecker(arrOfProps) {
130  function validate(props, propName, componentName) {
131    const usedPropCount = arrOfProps
132      .map(listedProp => props[listedProp])
133      .reduce((acc, curr) => acc + (curr !== undefined ? 1 : 0), 0);
134
135    if (usedPropCount > 1) {
136      const [first, ...others] = arrOfProps;
137      const message = `${others.join(', ')} and ${first}`;
138      return new Error(
139        `Invalid prop '${propName}', only one of the following ` +
140        `may be provided: ${message}`
141      );
142    }
143  }
144  return validate;
145}
146
147function all(propTypes) {
148  if (propTypes === undefined) {
149    throw new Error('No validations provided');
150  }
151
152  if (!(propTypes instanceof Array)) {
153    throw new Error('Invalid argument must be an array');
154  }
155
156  if (propTypes.length === 0) {
157    throw new Error('No validations provided');
158  }
159
160  return function(props, propName, componentName) {
161    for(let i = 0; i < propTypes.length; i++) {
162      let result = propTypes[i](props, propName, componentName);
163
164      if (result !== undefined && result !== null) {
165        return result;
166      }
167    }
168  };
169}
170
171function createElementTypeChecker() {
172  function validate(props, propName, componentName) {
173    let errBeginning = errMsg(props, propName, componentName,
174      '. Expected an Element `type`');
175
176    if (typeof props[propName] !== 'function') {
177      if (React.isValidElement(props[propName])) {
178        return new Error(errBeginning + ', not an actual Element');
179      }
180
181      if (typeof props[propName] !== 'string') {
182        return new Error(errBeginning +
183          ' such as a tag name or return value of React.createClass(...)');
184      }
185    }
186  }
187
188  return createChainableTypeChecker(validate);
189}
190
191export default CustomPropTypes;
192
Full Screen

Accelerate Your Automation Test Cycles With LambdaTest

Leverage LambdaTest’s cloud-based platform to execute your automation tests in parallel and trim down your test execution time significantly. Your first 100 automation testing minutes are on us.

Try LambdaTest

Run JavaScript Tests on LambdaTest Cloud Grid

Execute automation tests with Playwright Internal on a cloud-based Grid of 3000+ real browsers and operating systems for both web and mobile applications.

Test now for Free
LambdaTestX

We use cookies to give you the best experience. Cookies help to provide a more personalized experience and relevant advertising for you, and web analytics for us. Learn More in our Cookies policy, Privacy & Terms of service

Allow Cookie
Sarah

I hope you find the best code examples for your project.

If you want to accelerate automated browser testing, try LambdaTest. Your first 100 automation testing minutes are FREE.

Sarah Elson (Product & Growth Lead)