Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: make extension patterns match the end of the file name #5652

28 changes: 22 additions & 6 deletions packages/upload/src/vaadin-upload.js
Original file line number Diff line number Diff line change
Expand Up @@ -492,6 +492,26 @@ class Upload extends ElementMixin(ThemableMixin(ControllerMixin(PolymerElement))
];
}

/** @private */
get __acceptRegexp() {
if (!this.accept) {
return null;
}
const processedTokens = this.accept.split(',').map((token) => {
let processedToken = token.trim();
// Escape regex operators common to mime types
processedToken = processedToken.replace(/[+.]/gu, '\\$&');
// Make extension patterns match the end of the file name
if (processedToken.startsWith('\\.')) {
processedToken = `.*${processedToken}$`;
}
// Handle star (*) wildcards
return processedToken.replace(/\/\*/gu, '/.*');
});
// Create accept regex
return new RegExp(`^(${processedTokens.join('|')})$`, 'iu');
}

/** @protected */
ready() {
super.ready();
Expand Down Expand Up @@ -879,12 +899,8 @@ class Upload extends ElementMixin(ThemableMixin(ControllerMixin(PolymerElement))
);
return;
}
const fileExt = file.name.match(/\.[^.]*$|$/u)[0];
// Escape regex operators common to mime types
const escapedAccept = this.accept.replace(/[+.]/gu, '\\$&');
// Create accept regex that can match comma separated patterns, star (*) wildcards
const re = new RegExp(`^(${escapedAccept.replace(/[, ]+/gu, '|').replace(/\/\*/gu, '/.*')})$`, 'iu');
if (this.accept && !(re.test(file.type) || re.test(fileExt))) {
const re = this.__acceptRegexp;
if (re && !(re.test(file.type) || re.test(file.name))) {
this.dispatchEvent(
new CustomEvent('file-reject', {
detail: { file, error: this.i18n.error.incorrectFileType },
Expand Down
14 changes: 14 additions & 0 deletions packages/upload/test/adding-files.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -190,6 +190,20 @@ describe('adding files', () => {
expect(upload.files.length).to.equal(1);
});

it('should allow files with extensions containing multiple dots', () => {
vursen marked this conversation as resolved.
Show resolved Hide resolved
upload.accept = 'image/*,.bar.baz,video/*';
file.name = 'foo.bar.baz';
upload._addFiles([file]);
expect(upload.files).to.have.lengthOf(1);
});

it('should reject files that have partial extension match', () => {
upload.accept = 'image/*,.bar.baz,video/*';
file.name = 'foo.baz';
upload._addFiles([file]);
expect(upload.files).to.have.lengthOf(0);
});

it('should allow files with correct mime type', () => {
upload.accept = 'application/x-octet-stream';
upload._addFiles([file]);
Expand Down