Validation (FileAllowed) issue upgrading 0.13.1 -> 0.14

[docapotamus]

I upgraded Flask-WTF last night from 0.13.1 -> 0.14

The issue I have is that when the FileField is blank (if the user chooses not to upload an image) then the validation fails. I do not require the field.

class PostForm(FlaskForm):
    """Handle the input from the web for posts and replies."""
    body = TextAreaField('Post')

    upload = FileField('Upload', [
        FileAllowed(['gif', 'jpg', 'jpeg', 'png'],
                    'Only "gif", "jpg", "jpeg" and "png" files are supported')
    ])

    permission = RadioField('Permission', choices=[
        ('0', 'Public'),
        ('1', 'Pjuu'),
        ('2', 'Approved')
    ], default=0)

    def validate_body(self, field):
        if len(field.data.strip()) == 0 and not self.upload.data:
            raise ValidationError('Sorry. A message or an image is required.')

        if len(field.data.replace('\r\n', '\n')) > MAX_POST_LENGTH:
            raise ValidationError('Oh no! Posts can not be larger than '
                                  '{} characters'.format(MAX_POST_LENGTH))

If I do this through my test suite all is okay using the following code:

resp = self.client.post(
    url_for('posts.post'),
    data={
        'body': 'Test',
        'upload': '',
    },
    follow_redirects=True
)

The the post is successful. However if I make the request through Firefox (or Chrome) the validation is triggered saying I have an invalid format.

Request body:

Content-Type: multipart/form-data; boundary=---------------------------138689464934064453715802001
Content-Length: 651

-----------------------------138689464934064453715802001
Content-Disposition: form-data; name="body"

Test
-----------------------------138689464934064453715802001
Content-Disposition: form-data; name="csrf_token"

IjY4YTZmYjNmNWM4MWJlNmVjMjc3Y2Y4YjBiMTM1Nzk3YTdhMGZkNjci.C1Vusg.RCp4SBZKai60nRqMGYP63i8JfXM
-----------------------------138689464934064453715802001
Content-Disposition: form-data; name="permission"

0
-----------------------------138689464934064453715802001
Content-Disposition: form-data; name="upload"; filename=""
Content-Type: application/octet-stream


-----------------------------138689464934064453715802001--

This was happening before I fixed the deprecation warnings that FileField is getting removed and to use the built-in WTForms FileField and after I changed the code to use this.

I believe it's something to do with this change but can't find any documentation.

I have had to revert the change as it stopped my site being usable.

Thanks in advance

[docapotamus]

@ThiefMaster on #pocoo suggested trying wtforms.validators.Optional which didn't help.

[davidism]

Turns out my assumption was wrong: empty file fields still populate request.files, just with empty FileStorage instances. I think I'll un-deprecate FileField along with updating the two validators.

[davidism]

Optional doesn't work for the same reason: raw_data is not an empty list, it's a list with an empty FileStorage. But the change to FileField didn't affect that. If I make FileField only populate if the data is non-empty, that would solve this problem.

[davidism]

Fixed in release 0.14.1 on PyPI.

[docapotamus]

@davidism Thank you very much for getting this sorted so fast. It's a massive help.
Sorry I didn't have the time to investigate further myself 😀

[WTRipper]

Seems that this bug still exists using following setup:
Versions

Flask==0.12
Flask-Bootstrap==3.3.7.1
Flask-WTF==0.14.2
WTForms==2.1

form class defintion

from flask_wtf import FlaskForm
from flask_wtf.file import FileField
from wtforms import SubmitField

class NewExample(FlaskForm):
    datei = FileField("Dateiupload",
                      render_kw={'multiple': 'True'}
                      )
    submit = SubmitField("Store this")

route

@main.route('/example', methods=["POST"])
def new_snippet():
    form = NewExample()
    if form.validate_on_submit():
        files = request.files.getlist("datei")
        if files:
            for f in files:
                print(f)
        return redirect(url_for("main.other_page"))
    else:
        return abort(404)

rendering

{% extends "bootstrap/base.html" %}
{% import "bootstrap/wtf.html" as wtf %}
{{ wtf.quick_form(form) }}

Using this setup and submitting an empty form will print

<FileStorage: '' ('application/octet-stream')>

[davidism]

What's the problem in Flask-WTF? Werkzeug adds empty file objects for each field received, regardless of if the file contained data. You're not using Flask-WTF to process the form data, so it won't check that the object is empty.

[WTRipper]

But there is no other way to process multiple files in Flask-WTF at the moment, right?
Using a route like this:

@main.route('/example', methods=["POST"])
def new_snippet():
    form = NewExample()
    if form.validate_on_submit():
        files = form.datei.data
        if files:
            for f in files:
                print(f)
        return redirect(url_for("main.other_page"))
    else:
        return abort(404)

Gives you None when leaving the FileField empty but only gives the first FileStorage object if multiple files are selected.

[WTRipper]

Probably something that would be fixed with your patch right?

[davidism]

Yes, I was about to link that. As it says at the bottom, just copy those fields into your own code, there's nothing requiring them to be in WTForms.

[WTRipper]

form_fix.py

from wtforms.widgets import Input
from wtforms.fields.core import Field


class FileInput(Input):
    """Render a file chooser input.
    :param multiple: allow choosing multiple files
    """

    input_type = 'file'

    def __init__(self, multiple=False):
        super(FileInput, self).__init__()
        self.multiple = multiple

    def __call__(self, field, **kwargs):
        # browser ignores value of file input for security
        kwargs['value'] = False

        if self.multiple:
            kwargs['multiple'] = True

        return super(FileInput, self).__call__(field, **kwargs)


class FileField(Field):
    """Renders a file upload field.
    By default, the value will be the filename sent in the form data.
    WTForms **does not** deal with frameworks' file handling capabilities.
    A WTForms extension for a framework may replace the filename value
    with an object representing the uploaded data.
    """

    widget = FileInput()

    def _value(self):
        # browser ignores value of file input for security
        return False


class MultipleFileField(FileField):
    """A :class:`FileField` that allows choosing multiple files."""

    widget = FileInput(multiple=True)

    def process_formdata(self, valuelist):
        self.data = valuelist

form class definition

from flask_wtf import FlaskForm
from .form_fix import MultipleFileField
from wtforms import SubmitField

class NewExample(FlaskForm):
    datei = MultipleFileField("Dateiupload")
    submit = SubmitField("Store this")

This renders something that looks like a StringInput behind the FileInput when using {{ wtf.quick_form(form) }}. And form.datei.data seems to be a list of strings (the file names I uploaded). What's wrong? That's probably some mistake I made.. Hope I waste not your time. I really appreciate your fast responses!

The rendered html:

<div class="form-group "><label class="control-label" for="datei">Dateiupload</label>
        
          <input class="form-control" id="datei" multiple name="datei" type="file">
        
  </div>

[WTRipper]

By manually calling {{ form.datei }} fixes the rendering problem but still form.datei.data is a list of filename strings.

[davidism]

Please use Stack Overflow for questions about your own code. If you have a new bug report, after ensuring it is a bug with Flask-WTF, please open a new issue.