Merge pull request #82 from plone/additional_css_class

Allow setting custom CSS class *outside* widget

.gitignore

@@ -8,3 +8,7 @@ dist
 /bin
 /parts
 /develop-eggs
+/include
+/lib*
+.*.swp
+pip-selfcheck.json

CHANGES.rst

@@ -2,7 +2,7 @@ Changelog
 =========
 
 3.0.3 (unreleased)
-------------------
+------------------------
 
 Breaking changes:
 
@@ -29,6 +29,12 @@ Bug fixes:
   the query string is lost
   [tomgross]
 
+- Allow an additional CSS class for widgets in this package
+  [tomgross]
+
+- Document customization of widgets
+  [tomgross]
+
 3.0.2 (2017-09-06)
 ------------------
 

README.rst

@@ -346,6 +346,34 @@ to display these fields in view mode, add the following css in your theme::
        display: none;
     }
 
+
+Add additional parameters to widgets
+=====================================
+
+You can add additional parameters to widgets defined in this package
+via the `plone.autoform.widgets.ParameterizedWidget` ::
+
+  from plone.app.z3c.form.widget import DateWidget
+  MyDateWidget = ParameterizedWidget(DateWidget, wrapper_css_class='event_start')
+
+
+or via directives ::
+
+  from plone.app.z3c.form.widget import DateWidget
+
+
+  @provider(IFormFieldProvider)
+  class IMyEventBehavior(model.Schema):
+
+  ...
+      widget('event_start', DateWidget, wrapper_css_class='event_start')
+      event_start = schema.TextLine(
+          title=_(u'label_event_start'),
+          description=_(u'help_event_start'),
+          required=True,
+      )
+
+
 Testing
 ===============
 
@@ -358,7 +386,7 @@ If you still need to test forms on lower level in unit tests
 you need to enable ``plone.app.z3cform`` support manually.
 Below is an example::
 
-    import unittest2 as unittest
+    import unittest
 
     from zope.interface import alsoProvides
     from zope.publisher.browser import setDefaultSkin

buildout.cfg

@@ -1,5 +1,5 @@
 [buildout]
-extends = https://raw.githubusercontent.com/collective/buildout.plonetest/master/test-5.x.cfg
+extends = https://raw.githubusercontent.com/collective/buildout.plonetest/master/test-5.1.x.cfg
 package-name = plone.app.z3cform
 package-extras = [tests]
 

plone/app/z3cform/templates/widget.pt

@@ -7,9 +7,10 @@
                error_class python:error and ' error' or '';
                empty_values python: (None, '', [], ('', '', '', '00', '00', ''), ('', '', ''));
                empty_class python: (widget.value in empty_values) and ' empty' or '';
+	       wrapper_css_class  widget/wrapper_css_class|nothing;
                fieldname_class string:kssattr-fieldname-${widget/name};"
    data-pat-inlinevalidation='{"type":"z3c.form"}'
-   tal:attributes="class string:field pat-inlinevalidation ${fieldname_class}${error_class}${empty_class};
+   tal:attributes="class string:field pat-inlinevalidation ${fieldname_class}${error_class}${empty_class} ${wrapper_css_class};
                    data-fieldname widget/name;
                    id string:formfield-${widget/id};">
     <label for="" class="horizontal"

plone/app/z3cform/tests/test_widgets.py

@@ -6,12 +6,17 @@
 from plone.app.testing import TEST_USER_ID
 from plone.app.z3cform.tests.layer import PAZ3CForm_INTEGRATION_TESTING
 from plone.app.z3cform.widget import BaseWidget
+from plone.app.z3cform.widget import DateWidget
+from plone.autoform.directives import widget
+from plone.autoform.form import AutoExtensibleForm
 from plone.dexterity.fti import DexterityFTI
 from plone.registry.interfaces import IRegistry
+from plone.supermodel.model import Schema
 from plone.testing.zca import UNIT_TESTING
 from plone.uuid.interfaces import IUUID
 from Products.CMFPlone.interfaces import IMarkupSchema
 from z3c.form.form import Form
+from z3c.form.form import EditForm
 from z3c.form.interfaces import IFormLayer
 from z3c.form.widget import FieldWidget
 from zope.component import getUtility
@@ -1588,3 +1593,25 @@ def test_link_widget__data_converter(self):
             converter.toWidgetValue(u'mailto:me?subject=jep')['email_subject'],
             u'jep'
         )
+
+
+class WidgetCustomizingIntegrationTests(unittest.TestCase):
+
+    layer = PAZ3CForm_INTEGRATION_TESTING
+
+    def test_widget_base_wrapper_css(self):
+
+        class ITestDateSchema(Schema):
+
+            widget('my_date', DateWidget, wrapper_css_class='foo')
+            my_date = Date(title=u'My Date')
+
+        class TestForm(AutoExtensibleForm, EditForm):
+
+            ignoreContext = True
+            schema = ITestDateSchema
+
+        render = TestForm(self.layer['portal'], self.layer['request'])
+        self.assertIn(
+            'empty foo" data-fieldname="form.widgets.my_date"', render())
+