【Storybook】`storyshots-puppeteer` で異なるデバイスのビジュアルスナップショットを撮る方法

Storybook に storyshots-puppeteer を導入した後、異なるデバイスのビジュアルスナップショットを撮れるようにしたいと思い、下記のように書き換えました。

import initStoryshots from '@storybook/addon-storyshots'
import { imageSnapshot } from '@storybook/addon-storyshots-puppeteer'
import pupDevices from 'puppeteer/DeviceDescriptors';

const supportedDevices = new Set(['iPad', 'iPhone 5', 'iPhone 6', 'iPhone 7 Plus'])

initStoryshots({ suite: 'Image storyshots: PC', test: imageSnapshot() })

function createCustomizePage(pupDevice) {
  return function(page) {
    return page.emulate(pupDevice);
  }
}

for (let supportedDevice of supportedDevices) {
  const pupDevice = pupDevices[supportedDevice];

  if (!pupDevice) {
    continue;
  }

  const customizePage = createCustomizePage(pupDevice);

  initStoryshots({
    suite: `Image storyshots: ${pupDevice.name}`,
    test: imageSnapshot({
      customizePage,
    })
  });
}