How to use _onClose method in Puppeteer

Best JavaScript code snippet using puppeteer

Run Puppeteer automation tests on LambdaTest cloud grid

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

LayerExamplesDoc.js

Source: LayerExamplesDoc.js Github

copy
1// (C) Copyright 2014-2017 Hewlett Packard Enterprise Development LP
2
3import React, { Component } from 'react';
4import Button from 'grommet/components/Button';
5import Layer from 'grommet/components/Layer';
6import InteractiveExample from '../../../components/InteractiveExample';
7import SampleArticle from '../samples/SampleArticle';
8import ConfirmationForm from '../samples/ConfirmationForm';
9import FullForm from '../samples/FullForm';
10import LazyList from '../samples/LazyList';
11import LazyTiles from '../samples/LazyTiles';
12import LazyTable from '../samples/LazyTable';
13
14Layer.displayName = 'Layer';
15
16const PROPS_SCHEMA = {
17  closer: { value: true },
18  flush: { value: true },
19  align: { options: ['center', 'top', 'bottom', 'left', 'right'] },
20  overlayClose: { value: false }
21};
22
23const CONTENTS_SCHEMA = {
24  contents: { options: [
25    'article', 'form', 'confirmation', 'lazy list', 'lazy tiles', 'lazy table'
26  ] }
27};
28
29export default class ColumnsExamplesDoc extends Component {
30
31  constructor () {
32    super();
33    this._onClose = this._onClose.bind(this);
34    this.state = {
35      active: false, contents: {}, elementProps: {}
36    };
37  }
38
39  _onClose () {
40    this.setState({ active: false });
41  }
42
43  render () {
44    const { active, contents, elementProps } = this.state;
45
46    let content;
47    if ('article' === contents.contents || ! contents.contents) {
48      content = <SampleArticle />;
49    } else if ('form' === contents.contents) {
50      content = (
51        <FullForm onCancel={this._onClose} onSubmit={this._onClose} />
52      );
53    } else if ('confirmation' === contents.contents) {
54      content = (
55        <ConfirmationForm onCancel={this._onClose} onSubmit={this._onClose} />
56      );
57    } else if ('lazy list' === contents.contents) {
58      content = <LazyList />;
59    } else if ('lazy tiles' === contents.contents) {
60      content = <LazyTiles />;
61    } else if ('lazy table' === contents.contents) {
62      content = <LazyTable />;
63    }
64
65    const layer = (
66      <Layer {...elementProps} onClose={this._onClose}>
67        {content}
68      </Layer>
69    );
70
71    const control = (
72      <Button label='Show layer'
73        onClick={() => this.setState({ active: true })} />
74    );
75
76    const element = active ? layer : control;
77
78    return (
79      <InteractiveExample contextLabel='Layer' contextPath='/docs/layer'
80        preamble={`import Layer from 'grommet/components/Layer';`}
81        propsSchema={PROPS_SCHEMA}
82        codeElement={layer}
83        contentsSchema={CONTENTS_SCHEMA}
84        element={element}
85        onChange={(elementProps, contents) => {
86          this.setState({ elementProps, contents });
87        }} />
88    );
89  }
90};
91
Full Screen

Chat.js

Source: Chat.js Github

copy
1// @flow
2
3import React from 'react';
4import { KeyboardAvoidingView, SafeAreaView } from 'react-native';
5
6import { ColorSchemeRegistry } from '../../../base/color-scheme';
7import { translate } from '../../../base/i18n';
8import { HeaderWithNavigation, SlidingView } from '../../../base/react';
9import { connect } from '../../../base/redux';
10import { StyleType } from '../../../base/styles';
11
12import AbstractChat, {
13    _mapDispatchToProps,
14    _mapStateToProps as _abstractMapStateToProps,
15    type Props as AbstractProps
16} from '../AbstractChat';
17
18import ChatInputBar from './ChatInputBar';
19import MessageContainer from './MessageContainer';
20import MessageRecipient from './MessageRecipient';
21import styles from './styles';
22
23type Props = AbstractProps & {
24
25    /**
26     * The color-schemed stylesheet of the feature.
27     */
28    _styles: StyleType
29};
30
31/**
32 * Implements a React native component that renders the chat window (modal) of
33 * the mobile client.
34 */
35class Chat extends AbstractChat<Props> {
36    /**
37     * Instantiates a new instance.
38     *
39     * @inheritdoc
40     */
41    constructor(props: Props) {
42        super(props);
43
44        this._onClose = this._onClose.bind(this);
45    }
46
47    /**
48     * Implements React's {@link Component#render()}.
49     *
50     * @inheritdoc
51     */
52    render() {
53        const { _styles } = this.props;
54
55        return (
56            <SlidingView
57                onHide = { this._onClose }
58                position = 'bottom'
59                show = { this.props._isOpen } >
60                <KeyboardAvoidingView
61                    behavior = 'padding'
62                    style = { styles.chatContainer }>
63                    <HeaderWithNavigation
64                        headerLabelKey = 'chat.title'
65                        onPressBack = { this._onClose } />
66                    <SafeAreaView style = { _styles.backdrop }>
67                        <MessageContainer messages = { this.props._messages } />
68                        <MessageRecipient />
69                        <ChatInputBar onSend = { this.props._onSendMessage } />
70                    </SafeAreaView>
71                </KeyboardAvoidingView>
72            </SlidingView>
73        );
74    }
75
76    _onClose: () => boolean
77
78    /**
79     * Closes the chat window.
80     *
81     * @returns {boolean}
82     */
83    _onClose() {
84        if (this.props._isOpen) {
85            this.props._onToggleChat();
86
87            return true;
88        }
89
90        return false;
91    }
92}
93
94/**
95 * Maps part of the redux state to the props of this component.
96 *
97 * @param {Object} state - The Redux state.
98 * @returns {Props}
99 */
100function _mapStateToProps(state) {
101    return {
102        ..._abstractMapStateToProps(state),
103        _styles: ColorSchemeRegistry.get(state, 'Chat')
104    };
105}
106
107export default translate(connect(_mapStateToProps, _mapDispatchToProps)(Chat));
108
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 Puppeteer 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)