Unlock 30% off on Manual Testing Annual Plans this Holiday Season.

Copied to Clipboard!

How to use keydownListener method in devicefarmer-stf

Best JavaScript code snippet using devicefarmer-stf

row_drawer.js

Source:row_drawer.js

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  };...

useKeyboard.ts

Source:useKeyboard.ts

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};...

body-keydown.directive.ts

Source:body-keydown.directive.ts

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  }...

Using AI Code Generation

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();

Using AI Code Generation

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

Using AI Code Generation

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});

Using AI Code Generation

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});

Using AI Code Generation

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});

Using AI Code Generation

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

Using AI Code Generation

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

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.