|
| 1 | +import fs from 'fs'; |
| 2 | +import path from 'path'; |
| 3 | +import Command, { flags } from '@percy/cli-command'; |
| 4 | +import log from '@percy/logger'; |
| 5 | +import globby from 'globby'; |
| 6 | +import imageSize from 'image-size'; |
| 7 | +import PercyClient from '@percy/client'; |
| 8 | +import createImageResources from '../resources'; |
| 9 | +import { schema } from '../config'; |
| 10 | + |
| 11 | +const ALLOWED_IMAGE_TYPES = /\.(png|jpg|jpeg)$/i; |
| 12 | + |
| 13 | +export class Upload extends Command { |
| 14 | + static description = 'Upload a directory of images to Percy'; |
| 15 | + |
| 16 | + static args = [{ |
| 17 | + name: 'dirname', |
| 18 | + description: 'directory of images to upload', |
| 19 | + required: true |
| 20 | + }]; |
| 21 | + |
| 22 | + static flags = { |
| 23 | + ...flags.logging, |
| 24 | + ...flags.config, |
| 25 | + |
| 26 | + files: flags.glob({ |
| 27 | + char: 'f', |
| 28 | + multiple: true, |
| 29 | + description: 'one or more globs matching image file paths to upload', |
| 30 | + default: schema.upload.properties.files.default, |
| 31 | + percyrc: 'upload.files' |
| 32 | + }), |
| 33 | + ignore: flags.glob({ |
| 34 | + char: 'i', |
| 35 | + multiple: true, |
| 36 | + description: 'one or more globs matching image file paths to ignore', |
| 37 | + percyrc: 'upload.ignore' |
| 38 | + }), |
| 39 | + 'dry-run': flags.boolean({ |
| 40 | + char: 'd', |
| 41 | + description: 'prints a list of matching images to upload without uploading' |
| 42 | + }) |
| 43 | + }; |
| 44 | + |
| 45 | + static examples = [ |
| 46 | + '$ percy upload ./images' |
| 47 | + ]; |
| 48 | + |
| 49 | + async run() { |
| 50 | + if (!this.isPercyEnabled()) { |
| 51 | + log.info('Percy is disabled. Skipping upload'); |
| 52 | + return; |
| 53 | + } |
| 54 | + |
| 55 | + let { dirname } = this.args; |
| 56 | + |
| 57 | + if (!fs.existsSync(dirname)) { |
| 58 | + return this.error(`Not found: ${dirname}`); |
| 59 | + } else if (!fs.lstatSync(dirname).isDirectory()) { |
| 60 | + return this.error(`Not a directory: ${dirname}`); |
| 61 | + } |
| 62 | + |
| 63 | + let { upload: { files, ignore } } = this.percyrc(); |
| 64 | + ignore = [].concat(ignore).filter(Boolean); |
| 65 | + |
| 66 | + let paths = await globby(files, { cwd: dirname, ignore }); |
| 67 | + paths.sort(); |
| 68 | + |
| 69 | + if (!paths.length) { |
| 70 | + return this.error(`No matching files found in '${dirname}'`); |
| 71 | + } else if (this.flags['dry-run']) { |
| 72 | + log.info('Matching files:'); |
| 73 | + return paths.forEach(p => console.log(p)); |
| 74 | + } |
| 75 | + |
| 76 | + // we already have assets so we don't need asset discovery from @percy/core, |
| 77 | + // we can use @percy/client directly to send snapshots |
| 78 | + this.client = new PercyClient(); |
| 79 | + await this.client.createBuild(); |
| 80 | + log.info('Percy has started!'); |
| 81 | + |
| 82 | + let build = this.client.build; |
| 83 | + log.info(`Created build #${build.number}: ${build.url}`); |
| 84 | + |
| 85 | + for (let name of paths) { |
| 86 | + log.debug(`Uploading snapshot: ${name}`); |
| 87 | + |
| 88 | + // only snapshot supported images |
| 89 | + if (!name.match(ALLOWED_IMAGE_TYPES)) { |
| 90 | + log.info(`Skipping unsupported image type: ${name}`); |
| 91 | + continue; |
| 92 | + } |
| 93 | + |
| 94 | + let filepath = path.resolve(dirname, name); |
| 95 | + let buffer = fs.readFileSync(filepath); |
| 96 | + let { width, height } = imageSize(filepath); |
| 97 | + |
| 98 | + await this.client.sendSnapshot({ |
| 99 | + // width and height is clamped to API min and max |
| 100 | + widths: [Math.max(10, Math.min(width, 2000))], |
| 101 | + minimumHeight: Math.max(10, Math.min(height, 2000)), |
| 102 | + resources: createImageResources(name, buffer, width, height), |
| 103 | + name |
| 104 | + }); |
| 105 | + |
| 106 | + log.info(`Snapshot uploaded: ${name}`); |
| 107 | + } |
| 108 | + } |
| 109 | + |
| 110 | + // Finalize the build when finished |
| 111 | + async finally() { |
| 112 | + let build = this.client?.build; |
| 113 | + |
| 114 | + if (build?.id) { |
| 115 | + await this.client?.finalizeBuild(); |
| 116 | + log.info(`Finalized build #${build.number}: ${build.url}`); |
| 117 | + } |
| 118 | + } |
| 119 | +} |
0 commit comments