Posted at

Cypress ファイルアップロード

体裁はそのうち整える。


Cypress とは

https://www.cypress.io/

そのうち別ページに移す。

E2Eテストツール。

npmでも提供されているが、実行ファイルのみを単体でダウンロードして使用することも可能。

Chromeが同梱されていて、各開発者のローカルPCで動かすイメージ。

テスト自体はJSで記載する。

サンプルも割と豊富にあるので、基本的な操作はあまり困らない。


ファイルアップロード

ググるといくつか出てくるけど、、、英語ページばかりだったので備忘のため。


command.js


Cypress.Commands.add('upload_file', (fileName, fileType = ' ', selector) => {
cy.get(selector).then(subject => {
cy.fixture(fileName, 'base64')
.then(Cypress.Blob.base64StringToBlob)
.then((blob) => {
cy.log(blob);
const el = subject[0];
const testFile = new File([blob], fileName, { type: fileType });
const dataTransfer = new DataTransfer();
dataTransfer.items.add(testFile);
el.files = dataTransfer.files;
});
});
});


test.js

cy.upload_file(file_name, file_type, 'input[name=file_input]');