FIX: pick-files-button component (#14045)

A file should be accepted if it has supported extension OR supported MIME type.
This commit is contained in:
Andrei Prigorshnev 2021-08-19 14:56:03 +04:00 committed by GitHub
parent c0ec1e931e
commit 46cdddbac9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 51 additions and 38 deletions

View File

@ -79,7 +79,7 @@ export default Component.extend({
_haveAcceptedTypes(files) { _haveAcceptedTypes(files) {
for (const file of files) { for (const file of files) {
if ( if (
!(this._hasAcceptedExtension(file) && this._hasAcceptedMimeType(file)) !(this._hasAcceptedExtension(file) || this._hasAcceptedMimeType(file))
) { ) {
return false; return false;
} }

View File

@ -17,58 +17,71 @@ function createBlob(mimeType, extension) {
discourseModule( discourseModule(
"Integration | Component | pick-files-button", "Integration | Component | pick-files-button",
function (hooks) { function (hooks) {
const expectedExtension = ".json";
const expectedMimeType = "text/json";
setupRenderingTest(hooks); setupRenderingTest(hooks);
componentTest( hooks.beforeEach(function () {
"it shows alert if a file with an unsupported extension was chosen", this.set("acceptedFileTypes", [expectedExtension, expectedMimeType]);
{ this.set("onFilesPicked", () => {});
});
componentTest("it doesn't show alert if a file has a supported MIME type", {
skip: true, skip: true,
template: hbs` template: hbs`
{{pick-files-button {{pick-files-button
acceptedFileTypes=this.acceptedFileTypes acceptedFileTypes=this.acceptedFileTypes
onFilesChosen=this.onFilesChosen}}`, onFilesPicked=this.onFilesPicked}}`,
beforeEach() {
const expectedExtension = ".json";
this.set("acceptedFileTypes", [expectedExtension]);
this.set("onFilesChosen", () => {});
},
async test(assert) { async test(assert) {
sinon.stub(bootbox, "alert"); sinon.stub(bootbox, "alert");
const wrongExtension = ".txt"; const wrongExtension = ".txt";
const file = createBlob("text/json", wrongExtension); const file = createBlob(expectedMimeType, wrongExtension);
await triggerEvent("input#file-input", "change", { files: [file] }); await triggerEvent("input[type='file']", "change", { files: [file] });
assert.ok(bootbox.alert.calledOnce); assert.ok(bootbox.alert.notCalled);
}, },
} });
);
componentTest( componentTest("it doesn't show alert if a file has a supported extension", {
"it shows alert if a file with an unsupported MIME type was chosen",
{
skip: true, skip: true,
template: hbs` template: hbs`
{{pick-files-button {{pick-files-button
acceptedFileTypes=this.acceptedFileTypes acceptedFileTypes=this.acceptedFileTypes
onFilesChosen=this.onFilesChosen}}`, onFilesPicked=this.onFilesPicked}}`,
beforeEach() {
const expectedMimeType = "text/json";
this.set("acceptedFileTypes", [expectedMimeType]);
this.set("onFilesChosen", () => {});
},
async test(assert) { async test(assert) {
sinon.stub(bootbox, "alert"); sinon.stub(bootbox, "alert");
const wrongMimeType = "text/plain"; const wrongMimeType = "text/plain";
const file = createBlob(wrongMimeType, ".json"); const file = createBlob(wrongMimeType, expectedExtension);
await triggerEvent("input#file-input", "change", { files: [file] }); await triggerEvent("input[type='file']", "change", { files: [file] });
assert.ok(bootbox.alert.notCalled);
},
});
componentTest(
"it shows alert if a file has an unsupported extension and unsupported MIME type",
{
skip: true,
template: hbs`
{{pick-files-button
acceptedFileTypes=this.acceptedFileTypes
onFilesPicked=this.onFilesPicked}}`,
async test(assert) {
sinon.stub(bootbox, "alert");
const wrongExtension = ".txt";
const wrongMimeType = "text/plain";
const file = createBlob(wrongMimeType, wrongExtension);
await triggerEvent("input[type='file']", "change", { files: [file] });
assert.ok(bootbox.alert.calledOnce); assert.ok(bootbox.alert.calledOnce);
}, },