TypeScript test.default函數代碼示例

test('Interactable copies and extends defaults', (t) => {
  const scope = helpers.mockScope() as any
  const { defaults } = scope

  scope.actions.methodDict = { test: 'testize' }

  scope.Interactable.prototype.testize = function (options) {
    this.setPerAction('test', options)
  }

  defaults.actions.test = {
    fromDefault: { a: 1, b: 2 },
    specified: { c: 1, d: 2 },
  }

  const specified = { specified: 'parent' }

  const div = d('div')
  const interactable = scope.interactables.new(div, { test: specified })

  t.deepEqual(interactable.options.test.specified, specified.specified,
    'specified options are properly set')
  t.deepEqual(interactable.options.test.fromDefault, defaults.actions.test.fromDefault,
    'default options are properly set')
  t.notEqual(interactable.options.test.fromDefault, defaults.actions.test.fromDefault,
    'defaults are not aliased')

  defaults.actions.test.fromDefault.c = 3
  t.notOk('c' in interactable.options.test.fromDefault,
    'modifying defaults does not affect constructed interactables')

  t.end()
})

import { JSDOM } from '@interactjs/_dev/test/domator'
import test from '@interactjs/_dev/test/test'

test('typings', async (t) => {
  let error

  const { window } = new JSDOM('')

  ; (global as any).window = window
  ; (global as any).document = window.document

  try { require('./interactjs-test') }
  catch (e) { error = e }

  delete (global as any).window
  delete (global as any).document

  t.error(error, 'interactjs-test.ts compiles without error')
  t.end()
})

test('interact export', (t) => {
  scope.init(new JSDOM('').window)

  const interactable1 = interact('selector')
  t.assert(interactable1 instanceof scope.Interactable,
    'interact function returns Interactable instance')
  t.equal(interact('selector'), interactable1,
    'same interactable is returned with same target and context')
  t.equal(scope.interactables.list.length, 1,
    'new interactables are added to list')

  interactable1.unset()
  t.equal(scope.interactables.list.length, 0,
    'unset interactables are removed')

  const constructsUniqueMessage =
    'unique contexts make unique interactables with identical targets'

  const doc1 = new JSDOM('').window.document
  const doc2 = new JSDOM('').window.document
  const results = [
    ['repeat', doc1],
    ['repeat', doc2],
    [doc1, doc1],
    [doc2.body, doc2],
  ].reduce((acc, [target, context]) => {
    const interactable = interact(target, { context })

    if (acc.includes(interactable)) {
      t.fail(constructsUniqueMessage)
    }

    acc.push({ interactable, target, context })
    return acc
  }, [])

  t.pass(constructsUniqueMessage)

  const getsUniqueMessage =
    'interactions.get returns correct result with identical targets and different contexts'

  for (const { interactable, target, context } of results) {
    if (scope.interactables.get(target, { context }) !== interactable) {
      t.fail(getsUniqueMessage)
    }
  }

  t.pass(getsUniqueMessage)

  const doc3 = new JSDOM('').window.document

  const prevDocCount = scope.documents.length

  interact.addDocument(doc3, { events: { passive: false } })
  t.deepEqual(
    scope.documents[prevDocCount],
    { doc: doc3, options: { events: { passive: false } } },
    'interact.addDocument() adds to scope with options')

  interact.removeDocument(doc3)
  t.equal(
    scope.documents.length,
    prevDocCount,
    'interact.removeDocument() removes document from scope')

  scope.interactables.list.forEach((i) => i.unset())

  const plugin1 = { id: 'test-1', install () { plugin1.count++ }, count: 0 }
  const plugin2 = { id: undefined, install () { plugin2.count++ }, count: 0 }

  interact.use(plugin1)
  interact.use(plugin2)

  t.deepEqual([plugin1.count, plugin2.count], [1, 1], 'new plugin install methods are called')

  interact.use({ ...plugin1 })
  t.deepEqual([plugin1.count, plugin2.count], [1, 1], 'different plugin object with same id not installed')

  interact.use(plugin2)
  t.deepEqual([plugin1.count, plugin2.count], [1, 1], 'plugin without id not re-installed')

  t.end()
})

test('autoStart', (t) => {
  const scope: Interact.Scope = helpers.mockScope()

  scope.usePlugin(autoStart)
  scope.usePlugin(drag)

  const interaction = scope.interactions.new({})
  const element = scope.document.body
  const interactable = scope.interactables.new(element).draggable(true)
  const event = utils.pointer.coordsToEvent(utils.pointer.newCoords())
  const rect = { top: 100, left: 200, bottom: 300, right: 400 }
  interactable.rectChecker(() => ({ ...rect }))

  interaction.pointerDown(event, event, element)

  t.deepEqual(
    interaction.prepared,
    { name: 'drag', axis: 'xy', edges: undefined },
    'prepares action'
  )

  t.deepEqual(
    interaction.rect,
    rect as any,
    'set interaction.rect'
  )

  t.end()
})

      signals: new Signals(),
      types: [],
      fire: () => {},
    },
  })
}

test('holdRepeat count', (t) => {
  const pointerEvent = {
    type: 'hold',
    count: 0,
  }

  const { scope } = helpers.testEnv({ plugins: [pointerEvents, holdRepeat] })

  scope.pointerEvents.signals.fire('new', { pointerEvent })
  t.equal(pointerEvent.count, 1, 'first hold count is 1 with count previously undefined')

  const count = 20
  pointerEvent.count = count
  scope.pointerEvents.signals.fire('new', { pointerEvent })
  t.equal(pointerEvent.count, count + 1, 'existing hold count is incremented')

  t.end()
})

test('holdRepeat onFired', (t) => {
  const scope = mockScope()
  scope.usePlugin(pointerEvents)
  scope.usePlugin(holdRepeat)

  const interaction = scope.interactions.new({})

test('reflow', (t) => {
  const rect = Object.freeze({ top: 100, left: 200, bottom: 300, right: 400 })

  const {
    scope,
    interactable,
  } = helpers.testEnv({ plugins: [reflow], rect })

  Object.assign(scope.actions, { TEST: {}, names: ['TEST'] })

  t.ok(
    scope.Interactable.prototype.reflow instanceof Function,
    'reflow method is added to Interactable.prototype'
  )

  const fired = []

  interactable.fire = ((iEvent) => { fired.push(iEvent) }) as any
  (interactable.target as any) = {}
  interactable.options.TEST = { enabled: true }
  interactable.rectChecker(() => ({ ...rect }))

  // modify move coords
  scope.interactions.signals.on('before-action-move', ({ interaction }) => {
    interaction.coords.cur.page = {
      x: rect.left + 100,
      y: rect.top - 50,
    }
  })

  interactable.reflow({ name: 'TEST' })

  const phases = ['reflow', 'start', 'move', 'end']

  for (const index in phases) {
    const phase = phases[index]
    t.equal(fired[index].type, `TEST${phase}`, `event #${index} is ${phase}`)
  }

  const interaction = fired[0]._interaction

  t.deepEqual(
    interaction.coords.start.page,
    {
      x: rect.left,
      y: rect.top,
    },
    'uses element top left for event coords'
  )

  const reflowMove = fired[2]

  t.deepEqual(
    reflowMove.delta,
    { x: 100, y: -50 },
    'move delta is correct with modified interaction coords'
  )

  t.notOk(
    interaction.pointerIsDown,
    'reflow pointer was lifted'
  )

  t.equal(
    interaction.pointers.length,
    0,
    'reflow pointer was removed from interaction'
  )

  t.notOk(
    scope.interactions.list.includes(interaction),
    'interaction is removed from list'
  )

  t.end()
})

test('DropEvent constructor', (t) => {
  const interaction: any = { dropState: {} }
  const dragEvent = Object.freeze({
    interactable,
    _interaction: interaction,
    target: dragElement,
    timeStamp: 10,
  }) as InteractEvent

  utils.extend(interaction.dropState, {
    activeDrops: [
      { dropzone: dz1, element: el1 },
      { dropzone: dz2, element: el2 },
    ],
    cur : { dropzone: dz1, element: el1 },
    prev: { dropzone: dz2, element: el2 },
    events: {},
  })

  const dropmove = new DropEvent(interaction.dropState, dragEvent, 'dropmove')

  t.equal(dropmove.target, el1, 'dropmove uses dropState.cur.element')
  t.equal(dropmove.dropzone, dz1, 'dropmove uses dropState.cur.dropzone')
  t.equal(dropmove.relatedTarget, dragElement)

  const dragleave = new DropEvent(interaction.dropState, dragEvent, 'dragleave')

  t.equal(dragleave.target, el2, 'dropmove uses dropState.prev.element')
  t.equal(dragleave.dropzone, dz2, 'dropmove uses dropState.prev.dropzone')
  t.equal(dragleave.relatedTarget, dragElement)

  t.end()
})

import test from '@interactjs/_dev/test/test'
import * as helpers from './tests/_helpers'

test('scope', (t) => {
  const {
    scope,
    interactable,
    interaction,
    event,
  } = helpers.testEnv()

  interactable.options.test = { enabled: true }

  interaction.pointerDown(event, event, scope.document.body)
  interaction.start({ name: 'test' }, interactable, scope.document.body)

  const started = interaction._interacting

  interactable.unset()

  const stopped = !interaction._interacting

  t.ok(started && stopped, 'interaction is stopped on interactable.unset()')

  t.end()
})

test('utils/normalizeListeners', (t) => {
  const a = () => {}
  const b = () => {}
  const c = () => {}

  t.deepEqual(
    normalizeListeners('type1', a),
    {
      type1: [a],
    },
    'single type, single listener function')

  t.deepEqual(
    normalizeListeners('type1 type2', a),
    {
      type1: [a],
      type2: [a],
    },
    'multiple types, single listener function')

  t.deepEqual(
    normalizeListeners('type1 type2', a),
    normalizeListeners(['type1', 'type2'], a),
    'array of types equivalent to space separated string')

  t.deepEqual(
    normalizeListeners('type1', [a, b]),
    {
      type1: [a, b],
    },
    'single type, multiple listener functions')

  t.deepEqual(
    normalizeListeners('prefix', { _1: [a, b], _2: [b, c] }),
    {
      prefix_1: [a, b],
      prefix_2: [b, c],
    },
    'single type prefix, object of { suffix: [fn, ...] }')

  t.deepEqual(
    normalizeListeners('prefix1 prefix2', [{ _1: [a, b], _2: [b, c] }]),
    {
      prefix1_1: [a, b],
      prefix1_2: [b, c],
      prefix2_1: [a, b],
      prefix2_2: [b, c],
    },
    'multiple type prefixes, single length array of { suffix: [fn, ...] }')

  t.deepEqual(
    normalizeListeners({ _1: [a, b], _2: [b, c] }),
    {
      _1: [a, b],
      _2: [b, c],
    },
    'object of { suffix: [fn, ...] } as type arg')

  t.deepEqual(
    normalizeListeners({ '_1 _2': [a, b], '_3': [b, c] }),
    {
      _1: [a, b],
      _2: [a, b],
      _3: [b, c],
    },
    'object of { "suffix1 suffix2": [fn, ...], ... } as type arg')

  t.deepEqual(
    normalizeListeners('prefix', { '_1 _2': [a, b], '_3': [b, c] }),
    {
      prefix_1: [a, b],
      prefix_2: [a, b],
      prefix_3: [b, c],
    },
    'single type prefix, object of { "suffix1 suffix2": [fn, ...], ... }')

  t.end()
})

test('restrictEdges', (t) => {
  const interaction = new Interaction({ signals: mockSignals() } as any)
  interaction.prepared = {} as any
  interaction.prepared.edges = { top: true, bottom: true, left: true, right: true }
  interaction.resizeRects = {} as any
  interaction.resizeRects.inverted = { x: 10, y: 20, width: 300, height: 200 } as any
  interaction._interacting = true

  const options: any = { enabled: true }
  const coords = { x: 40, y: 40 }
  const offset = { top: 0, left: 0, bottom: 0, right: 0 }
  const state = { options, offset }
  const arg = { interaction, state } as any

  arg.coords = { ...coords }

  // outer restriction
  options.outer = { top: 100, left: 100, bottom: 200, right: 200 }
  restrictEdges.set(arg)

  t.deepEqual(
    arg.coords,
    { x: coords.y + 60, y: coords.y + 60 },
    'outer restriction is applied correctly'
  )

  arg.coords = { ...coords }

  // inner restriction
  options.outer = null
  options.inner = { top: 0, left: 0, bottom: 10, right: 10 }
  restrictEdges.set(arg)

  t.deepEqual(
    arg.coords,
    { x: coords.x - 40, y: coords.y - 40 },
    'inner restriction is applied correctly'
  )

  // offset
  Object.assign(offset, {
    top: 100,
    left: 100,
    bottom: 200,
    right: 200,
  })
  arg.coords = { ...coords }

  options.outer = { top: 100, left: 100, bottom: 200, right: 200 }
  options.inner = null
  restrictEdges.set(arg)

  t.deepEqual(
    arg.coords,
    { x: coords.x + 160, y: coords.x + 160 },
    'outer restriction is applied correctly with offset'
  )

  // start
  interaction.modifiers = {} as any
  interaction.modifiers.startOffset = { top: 5, left: 10, bottom: -8, right: -16 }
  interaction.interactable = {
    getRect () {
      return { top: 500, left: 900 }
    },
  } as any

  options.offset = 'self'
  restrictEdges.start(arg)

  t.deepEqual(
    arg.state.offset,
    { top: 505, left: 910, bottom: 508, right: 916 },
    'start gets x/y from selector string'
  )

  t.end()
})