{"size": 4554, "ext": "js", "max_stars_repo_path": "test/unit/demo.spec.js", "max_stars_repo_name": "hcl1687/iframe-channel", "max_stars_repo_stars_event_min_datetime": "2019-08-11T04:17:45.000Z", "max_stars_repo_stars_event_max_datetime": "2022-02-07T12:45:17.000Z", "max_issues_repo_path": "test/unit/demo.spec.js", "max_issues_repo_name": "hcl1687/iframe-channel", "max_issues_repo_issues_event_min_datetime": "2019-11-20T08:24:00.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-11T09:35:01.000Z", "max_forks_repo_path": "test/unit/demo.spec.js", "max_forks_repo_name": "hcl1687/iframe-channel", "max_forks_repo_forks_event_min_datetime": "2021-12-22T06:10:46.000Z", "max_forks_repo_forks_event_max_datetime": "2022-01-02T12:31:15.000Z"}
{"max_stars_count": 5, "max_issues_count": 49, "max_forks_count": 2, "avg_line_length": 32.7625899281, "max_line_length": 97, "alphanum_fraction": 0.5970575318}
import Channel from '../../src/index'

const { expect } = TEST_UTILS

describe('Channel demo', function () {
  it('Parent request connect', function (done) {
    const testIframe = document.createElement('iframe')
    testIframe.id = 'test-iframe'

    testIframe.onload = () => {
      const channel = new Channel({
        targetOrigin: 'http://localhost:3000', // only accept targetOrigin's message.
        target: testIframe && testIframe.contentWindow
      })
      channel.connect().then(() => {
        // have connected
        // now send a message, whose type is 'xx' and data is 'hello'
        channel.postMessage('xx', 'hello').then((data) => {
          // will receive 'hello_hi' from child
          expect(data).to.be.equal('hello_hi')

          // destory channel
          // Each Channel instance will add 'message' and 'beforeunload' event listener to window
          // object. So make sure destory the instance once it's unused.
          channel.destory()
          // destory iframe
          testIframe.parentNode.removeChild(testIframe)
          done()
        })
      })
    }

    testIframe.src = 'http://localhost:3000?type=demo_parent_request_connect'
    document.body.appendChild(testIframe)
  })

  it('Child request connect', function (done) {
    const testIframe = document.createElement('iframe')
    testIframe.id = 'test-iframe'

    const channel = new Channel({
      targetOrigin: 'http://localhost:3000'
    })

    channel.subscribe('connect', () => {
      // have connected
      // now send a message, whose type is 'xx' and data is 'hello'
      channel.postMessage('xx', 'hello').then((data) => {
        // will receive 'hello_hi' from child
        expect(data).to.be.equal('hello_hi')

        // destory channel
        // Each Channel instance will add 'message' and 'beforeunload' event listener to window
        // object. So make sure destory the instance once it's unused.
        channel.destory()
        // destory iframe
        testIframe.parentNode.removeChild(testIframe)
        done()
      })
    })

    testIframe.src = 'http://localhost:3000?type=demo_child_request_connect'
    document.body.appendChild(testIframe)
  })

  it('Post message before connect', function (done) {
    const testIframe = document.createElement('iframe')
    testIframe.id = 'test-iframe'

    testIframe.onload = () => {
      const channel = new Channel({
        targetOrigin: 'http://localhost:3000', // only accept targetOrigin's message.
        target: testIframe && testIframe.contentWindow
      })
      // not connect yet
      // now send a message, whose type is 'xx' and data is 'hello'
      channel.postMessage('xx', 'hello').then((data) => {
        // will receive 'hello_hi' from child
        expect(data).to.be.equal('hello_hi')

        // destory channel
        // Each Channel instance will add 'message' and 'beforeunload' event listener to window
        // object. So make sure destory the instance once it's unused.
        channel.destory()
        // destory iframe
        testIframe.parentNode.removeChild(testIframe)
        done()
      })
      channel.connect()
    }

    testIframe.src = 'http://localhost:3000?type=demo_post_message_before_connect'
    document.body.appendChild(testIframe)
  })

  it('Post function', function (done) {
    const testIframe = document.createElement('iframe')
    testIframe.id = 'test-iframe'

    testIframe.onload = () => {
      const channel = new Channel({
        targetOrigin: 'http://localhost:3000', // only accept targetOrigin's message.
        target: testIframe && testIframe.contentWindow
      })
      channel.connect().then(() => {
        // data can be a function, or an object or an array which contains function.
        const data = {
          add: function (a, b) {
            return new Promise(resolve => {
              setTimeout(() => {
                resolve(a + b)
              }, 1000)
            })
          },
          a: [2, function (a, b) {
            return a * b
          }],
          parentData: 1
        }

        channel.postMessage('xx', data, {
          hasFunction: true,
          functionKeys: ['add', 'a[1]']
        }).then((data) => {
          // will receive 4 from child
          expect(data).to.be.equal(4)

          channel.destory()
          testIframe.parentNode.removeChild(testIframe)
          done()
        })
      })
    }

    testIframe.src = 'http://localhost:3000?type=demo_post_function'
    document.body.appendChild(testIframe)
  })
})
