How to use keydownListener method in devicefarmer-stf

Best JavaScript code snippet using devicefarmer-stf

row_drawer.js

Source:row_drawer.js Github

copy

Full Screen

1// eslint-disable-next-line no-unused-vars2import React from 'react';3import PropTypes from 'prop-types';4import {Collapsible} from '../../collapsible';5import {Icon} from '../../iconography';6import {DefaultButton} from '../../buttons';7import classnames from 'classnames';8import {TablePlugin} from '../table_plugin';9const privates = new WeakMap();10const TABLE_KEYS = {11 UP: 38,12 DOWN: 4013};14const ROW_KEYS = {15 LEFT: 37,16 RIGHT: 3917};18export function withRowDrawer(Table) {19 class TbodyWithDrawer extends React.Component {20 static propTypes = {21 keyboardNavigation: PropTypes.bool22 };23 constructor(props) {24 super(props);25 this.state = {};26 privates.set(this, {});27 }28 componentWillMount() {29 if (!this.props.keyboardNavigation) return;30 const keyDownListener = e => this.handleKeyDown(e);31 privates.set(this, {keyDownListener});32 document.addEventListener('keydown', keyDownListener);33 }34 componentWillUnmount() {35 const {keyDownListener} = privates.get(this);36 if (!keyDownListener) return;37 document.removeEventListener('keydown', keyDownListener);38 privates.set(this, {keyDownListener: null});39 }40 handleKeyDown(e) {41 if (Object.values(TABLE_KEYS).indexOf(e.keyCode) === -1) return;42 e.preventDefault();43 const {children} = this.props;44 const {selectedRow} = this.state;45 const currentRow = typeof selectedRow === 'number' ? selectedRow : -1;46 let newSelectedRow;47 if (e.keyCode === TABLE_KEYS.UP) {48 newSelectedRow = Math.max(0, currentRow - 1);49 } else {50 newSelectedRow = Math.min(children.length - 1, currentRow + 1);51 }52 this.setState({selectedRow: newSelectedRow});53 }54 render() {55 const {selectedRow} = this.state;56 // eslint-disable-next-line no-unused-vars57 const {children: oldChildren, keyboardNavigation, ...props} = this.props;58 const children = oldChildren59 .filter(child => child)60 .map((child, i) => {61 const isSelected = i === selectedRow;62 if (!isSelected) return child;63 return React.cloneElement(child, {isSelected});64 });65 return <div {...props}>{children}</div>;66 }67 }68 class RowWithDrawer extends React.Component {69 static propTypes = {70 rowDrawer: PropTypes.func,71 rowIndex: PropTypes.number,72 rowDatum: PropTypes.object,73 keyboardNavigation: PropTypes.bool,74 isSelected: PropTypes.bool75 };76 constructor(props) {77 super(props);78 this.state = {expanded: false};79 privates.set(this, {});80 }81 componentWillMount() {82 if (!this.props.keyboardNavigation) return;83 const keyDownListener = e => this.handleKeyDown(e);84 privates.set(this, {keyDownListener});85 document.addEventListener('keydown', keyDownListener);86 }87 componentWillUnmount() {88 const {keyDownListener} = privates.get(this);89 if (!keyDownListener) return;90 document.removeEventListener('keydown', keyDownListener);91 privates.set(this, {keyDownListener: null});92 }93 handleKeyDown(e) {94 if (Object.values(ROW_KEYS).indexOf(e.keyCode) === -1) return;95 e.preventDefault();96 const {isSelected} = this.props;97 if (!isSelected) return;98 const {rowDrawer, rowIndex, rowDatum} = this.props;99 const drawerContent = rowIndex !== -1 && rowDrawer(rowIndex, rowDatum);100 if (!drawerContent) return;101 if (e.keyCode === ROW_KEYS.RIGHT) {102 this.setState({expanded: true});103 } else {104 this.setState({expanded: false});105 }106 }107 render() {108 // eslint-disable-next-line no-unused-vars109 const {children, rowDrawer, rowIndex, rowDatum, keyboardNavigation, isSelected, ...props} = this.props;110 const {expanded} = this.state;111 const drawerContent = rowIndex !== -1 && rowDrawer(rowIndex, rowDatum);112 const onClick = () => drawerContent && this.setState({expanded: !expanded});113 const src = expanded ? 'chevron_down' : 'chevron_right';114 const className = classnames(props.className, {expandable: rowIndex !== -1}, {expanded},115 {'tr-selected': isSelected}, {'no-drawer-content': rowIndex !== -1 && !drawerContent});116 let leftColumn;117 if (rowIndex !== -1) {118 leftColumn = (<DefaultButton119 flat120 iconOnly121 icon={<Icon {...{className: 'expand-icon', src}}/>}122 className="expand-button"123 aria-label="Expand"124 />);125 } else {126 leftColumn = (<div {...{127 className: 'th col col-fixed',128 style: {borderRightWidth: '0px', width: '36px'}129 }}/> );130 }131 return (132 <div className="tr-drawer">133 <div {...props} {...{onClick, className}}>134 {leftColumn}135 {children}136 </div>137 {rowIndex !== -1 && <Collapsible {...{expanded: expanded && !!drawerContent, delay: 200}}>138 {drawerContent}139 </Collapsible>}140 </div>141 );142 }143 }144 return class TableWithRowDrawer extends TablePlugin {145 static propTypes = {146 rowDrawer: PropTypes.func,147 keyboardNavigation: PropTypes.bool148 };149 render() {150 const {rowDrawer, keyboardNavigation, ...props} = this.props;151 return this.renderTable(Table, {152 tbodyTag: () => rowDrawer && TbodyWithDrawer,153 trTag: () => rowDrawer && RowWithDrawer,154 tbody: () => rowDrawer && {keyboardNavigation},155 tr: (props, {rowIndex, rowDatum}) => rowDrawer && {156 rowDrawer,157 rowIndex,158 rowDatum,159 keyboardNavigation160 }161 }, props);162 }163 };...

Full Screen

Full Screen

useKeyboard.ts

Source:useKeyboard.ts Github

copy

Full Screen

1import React, { KeyboardEventHandler, useCallback, useEffect } from "react";2// utils3import { eventKeys } from "utils/constants";4type TargetType = { element: HTMLElement } & ({ keyDown: boolean } | { keyUp: boolean });5export type UseKeyboardType = (props: {6 target?: TargetType;7 keyDownListener?: KeyboardEventHandler | Record<string, KeyboardEventHandler>;8 keyUpListener?: KeyboardEventHandler | Record<string, KeyboardEventHandler>;9}) => {10 handleKeyDown: KeyboardEventHandler;11 handleKeyUp: KeyboardEventHandler;12};13const useKeyboard: UseKeyboardType = ({ target, keyDownListener, keyUpListener }) => {14 const handleKeyDown = useCallback<KeyboardEventHandler>(15 (event) => {16 if (keyDownListener) {17 if (typeof keyDownListener === "function") {18 keyDownListener(event);19 } else {20 if (keyDownListener[event.keyCode]) {21 if (keyDownListener[eventKeys.BEFORE_ALL]) {22 keyDownListener[eventKeys.BEFORE_ALL](event);23 }24 keyDownListener[event.keyCode](event);25 if (keyDownListener[eventKeys.AFTER_ALL]) {26 keyDownListener[eventKeys.AFTER_ALL](event);27 }28 }29 }30 }31 },32 [keyDownListener]33 );34 const handleKeyUp = useCallback<KeyboardEventHandler>(35 (event) => {36 if (keyUpListener) {37 if (typeof keyUpListener === "function") {38 keyUpListener(event);39 } else {40 if (keyUpListener[event.keyCode]) {41 if (keyUpListener[eventKeys.BEFORE_ALL]) {42 keyUpListener[eventKeys.BEFORE_ALL](event);43 }44 keyUpListener[event.keyCode](event);45 if (keyUpListener[eventKeys.AFTER_ALL]) {46 keyUpListener[eventKeys.AFTER_ALL](event);47 }48 }49 }50 }51 },52 [keyUpListener]53 );54 // add [keydown] listener to [target.element]55 useEffect(() => {56 const onKeyDown = (event: KeyboardEvent) => {57 handleKeyDown(event as unknown as React.KeyboardEvent);58 };59 if (target && "keyDown" in target) {60 if (target?.element && target?.keyDown) {61 target.element.addEventListener("keydown", onKeyDown);62 }63 }64 return () => target?.element?.removeEventListener("keydown", onKeyDown);65 }, [target, handleKeyDown]);66 // add [keyup] listener to [target.element]67 useEffect(() => {68 const onKeyUp = (event: KeyboardEvent) => {69 handleKeyUp(event as unknown as React.KeyboardEvent);70 };71 if (target && "keyUp" in target) {72 if (target?.element && target?.keyUp) {73 target.element.addEventListener("keyup", onKeyUp);74 }75 }76 return () => target?.element?.removeEventListener("keyup", onKeyUp);77 }, [target, handleKeyUp]);78 return { handleKeyDown, handleKeyUp };79};...

Full Screen

Full Screen

body-keydown.directive.ts

Source:body-keydown.directive.ts Github

copy

Full Screen

1import { Directive, Input, ElementRef, OnInit, OnDestroy, NgZone } from '@angular/core';2import { DataTable, KeyboardAction } from '../base';3@Directive({4 selector: '[appBodyKeydown]'5})6export class BodyKeydownDirective implements OnInit, OnDestroy {7 @Input() table: DataTable;8 element: HTMLElement;9 private keyboardAction: KeyboardAction;10 private keydownListener: any;11 constructor(element: ElementRef, private ngZone: NgZone) {12 this.element = element.nativeElement;13 }14 ngOnInit(): void {15 this.keyboardAction = new KeyboardAction(this.table.events, this.table.selection);16 this.ngZone.runOutsideAngular(() => {17 this.keydownListener = this.onKeydown.bind(this);18 this.element.addEventListener('keydown', this.keydownListener);19 });20 }21 ngOnDestroy(): void {22 this.element.removeEventListener('keydown', this.keydownListener);23 }24 onKeydown(event: any): void {25 const maxColIndex = this.table.columns.length;26 const maxRowIndex = this.table.rows.length;27 this.ngZone.run(() => {28 this.keyboardAction.handleEvent(event, this.element, maxColIndex, maxRowIndex);29 });30 }...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var devicefarmer = require('devicefarmer-stf');2var stf = new devicefarmer();3stf.keydownListener(function(keyCode){4 console.log(keyCode);5});6var devicefarmer = require('devicefarmer-stf');7var stf = new devicefarmer();8stf.keyupListener(function(keyCode){9 console.log(keyCode);10});11var devicefarmer = require('devicefarmer-stf');12var stf = new devicefarmer();13stf.touchListener(function(touch){14 console.log(touch);15});16var devicefarmer = require('devicefarmer-stf');17var stf = new devicefarmer();18stf.gestureListener(function(gesture){19 console.log(gesture);20});21var devicefarmer = require('devicefarmer-stf');22var stf = new devicefarmer();23stf.orientationListener(function(orientation){24 console.log(orientation);25});26var devicefarmer = require('devicefarmer-stf');27var stf = new devicefarmer();28stf.batteryListener(function(battery){29 console.log(battery);30});31var devicefarmer = require('devicefarmer-stf');32var stf = new devicefarmer();33stf.networkListener(function(network){34 console.log(network);35});36var devicefarmer = require('devicefarmer-stf');37var stf = new devicefarmer();38stf.powerListener(function(power){39 console.log(power);40});41var devicefarmer = require('devicefarmer-stf');42var stf = new devicefarmer();43stf.notificationListener(function(notification){44 console.log(notification);45});46var devicefarmer = require('devicefarmer-stf');47var stf = new devicefarmer();

Full Screen

Using AI Code Generation

copy

Full Screen

1var stf = require('devicefarmer-stf-client');2device.keydownListener(function(data) {3 console.log(data);4});5{ serial: 'device-uuid',6 downTime: 1450960723869 }

Full Screen

Using AI Code Generation

copy

Full Screen

1var stf = require('devicefarmer-stf');2var stfClient = new stf.Client();3 return stfClient.getDevices();4}).then(function(devices) {5 return devices[0].keydownListener('KEYCODE_VOLUME_UP');6}).then(function() {7 console.log('key listener registered');8}).catch(function(err) {9 console.error(err);10});11 return stfClient.getDevices();12}).then(function(devices) {13 return devices[0].keyupListener('KEYCODE_VOLUME_UP');14}).then(function() {15 console.log('key listener registered');16}).catch(function(err) {17 console.error(err);18});19 return stfClient.getDevices();20}).then(function(devices) {21 return devices[0].keyListener('KEYCODE_VOLUME_UP');22}).then(function() {23 console.log('key listener registered');24}).catch(function(err) {25 console.error(err);26});

Full Screen

Using AI Code Generation

copy

Full Screen

1var keydownListener = require('devicefarmer-stf').events.keydownListener;2keydown.on('keydown', function(data) {3 console.log(data);4});5var keyupListener = require('devicefarmer-stf').events.keyupListener;6keyup.on('keyup', function(data) {7 console.log(data);8});9var keypressListener = require('devicefarmer-stf').events.keypressListener;10keypress.on('keypress', function(data) {11 console.log(data);12});13var keytypedListener = require('devicefarmer-stf').events.keytypedListener;14keytyped.on('keytyped', function(data) {15 console.log(data);16});17var touchListener = require('devicefarmer-stf').events.touchListener;18touch.on('touch', function(data) {19 console.log(data);20});21var rotationListener = require('devicefarmer-stf').events.rotationListener;22rotation.on('rotation', function(data) {23 console.log(data);24});25var batteryListener = require('devicefarmer-stf').events.batteryListener;26battery.on('battery', function(data) {27 console.log(data);28});29var powerListener = require('devicefarmer-stf').events.powerListener;30power.on('power', function(data) {31 console.log(data);32});

Full Screen

Using AI Code Generation

copy

Full Screen

1var stf = require('devicefarmer-stf');2var device = stf.device;3var keyEvent = stf.keyEvent;4var key = stf.key;5var device = new device();6var keyEvent = new keyEvent();7var key = new key();8var deviceSerial = "serial number of the device";9var keyCode = key.KEYCODE_HOME;10var metaKey = key.META_SHIFT_ON;11var action = keyEvent.ACTION_DOWN;12device.keydownListener(deviceSerial, keyCode, metaKey, action, function (err, res) {13 if (err) {14 console.log(err);15 } else {16 console.log(res);17 }18});

Full Screen

Using AI Code Generation

copy

Full Screen

1var stf = require('devicefarmer-stf');2var device = stf.device();3var keycode = require('keycode');4var key = keycode('space');5device.keydownListener(key, function (err) {6 if (err) {7 console.log(err);8 }9 else {10 console.log('key is pressed');11 }12});13var stf = require('devicefarmer-stf');14var device = stf.device();15var keycode = require('keycode');16var key = keycode('space');17device.keyupListener(key, function (err) {18 if (err) {19 console.log(err);20 }21 else {22 console.log('key is released');23 }24});25var stf = require('devicefarmer-stf');26var device = stf.device();27var keycode = require('keycode');28var key = keycode('space');29device.keypressListener(key, function (err) {30 if (err) {31 console.log(err);32 }33 else {34 console.log('key is pressed and released');35 }36});37var stf = require('devicefarmer-stf');38var device = stf.device();39device.textListener(function (err, text) {40 if (err) {41 console.log(err);42 }43 else {44 console.log(text);45 }46});47var stf = require('devicefarmer-stf');48var device = stf.device();49device.touchListener(function (err, touch) {50 if (err) {51 console.log(err);52 }53 else {54 console.log(touch);55 }56});57var stf = require('devicefarmer-stf');58var device = stf.device();59device.orientationListener(function (err, orientation) {60 if (err) {61 console.log(err);62 }63 else {64 console.log(orientation);65 }66});67var stf = require('devicefarmer-stf');68var device = stf.device();69device.batteryListener(function (err, battery) {70 if (err

Full Screen

Using AI Code Generation

copy

Full Screen

1var keyevent = require('devicefarmer-stf-keyevent');2var keycode = keyevent.keycode;3var listener = keyevent.keydownListener;4listener(keycode.KEYCODE_BACK);5listener(keycode.KEYCODE_HOME);6listener(keycode.KEYCODE_POWER);7listener(keycode.KEYCODE_VOLUME_UP);8listener(keycode.KEYCODE_VOLUME_DOWN);9listener(keycode.KEYCODE_VOLUME_MUTE);10var keyevent = require('devicefarmer-stf-keyevent');11var keycode = keyevent.keycode;12var listener = keyevent.keydownListener;13listener(keycode.KEYCODE_BACK);14listener(keycode.KEYCODE_HOME);15listener(keycode.KEYCODE_POWER);16listener(keycode.KEYCODE_VOLUME_UP);17listener(keycode.KEYCODE_VOLUME_DOWN);18listener(keycode.KEYCODE_VOLUME_MUTE);19var keyevent = require('devicefarmer-stf-keyevent');20var keycode = keyevent.keycode;21var listener = keyevent.keydownListener;22listener(keycode.KEYCODE_BACK);23listener(keycode.KEYCODE_HOME);24listener(keycode.KEYCODE_POWER);25listener(keycode.KEYCODE_VOLUME_UP);26listener(keycode.KEYCODE_VOLUME_DOWN);27listener(keycode.KEYCODE_VOLUME_MUTE);28var keyevent = require('devicefarmer-stf-keyevent');29var keycode = keyevent.keycode;30var listener = keyevent.keydownListener;31listener(keycode.KEYCODE_BACK);32listener(keycode.KEYCODE_HOME);33listener(keycode.KEYCODE_POWER);34listener(keycode.KEYCODE_VOLUME_UP);35listener(keycode.KEYCODE_VOLUME_DOWN);36listener(keycode.KEYCODE_VOLUME_MUTE);37var keyevent = require('devicefarmer-stf-keyevent');38var keycode = keyevent.keycode;39var listener = keyevent.keydownListener;40listener(keycode.KEYCODE_BACK);41listener(keycode.KEYCODE_HOME);42listener(keycode.KEYCODE_POWER

Full Screen

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.

LambdaTest Learning Hubs:

YouTube

You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.

Run devicefarmer-stf automation tests on LambdaTest cloud grid

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

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful