Merge pull request #26 from duckduckgo/jkt/setBreakageMaxLength

Set breakage description maxlength 2500 to reduce chance of reports n…

.github/workflows/tests.yml

@@ -34,6 +34,8 @@ jobs:
               run: npm run prettier.check
             - name: Run tests
               run: npm run test.unit
+            - name: Clean tree
+              run: npm run test.clean-tree
     build:
         runs-on: ubuntu-20.04
         needs: test

build/app/public/js/base.js

@@ -33055,7 +33055,7 @@ function _default() {
   var icon = (0, _heroEs.largeHeroIcon)({
     status: 'breakage-form'
   });
-  return (0, _bel["default"])(_templateObject || (_templateObject = _taggedTemplateLiteral(["<section class=\"sliding-subview\">\n        <div class=\"breakage-form\">\n        ", "\n        <div class=\"padding-x-double js-breakage-form-element\" data-state=\"idle\">\n            <div class=\"key-insight\">\n                ", "\n                <div class=\"breakage-form__advise\">\n                    <p class=\"token-title-3\">", "</p>\n                </div>\n                <div class=\"breakage-form__message\">\n                    <p class=\"token-title-3-em\">", "</p>\n                    <p class=\"token-title-3\">", "</p>\n                </div>\n            </div>\n            <div class=\"breakage-form__content\">\n                <div class=\"breakage-form__element\">\n                    <div class=\"form__group\">\n                        <div class=\"form__select breakage-form__input--dropdown\">\n                            <select class=\"js-breakage-form-dropdown\">\n                                <option value=''>", "</option>\n                                ", "\n                            </select>\n                        </div>\n                        <textarea class=\"form__textarea js-breakage-form-description\" placeholder=\"", "\"></textarea>\n                        <button class=\"form__submit token-label-em js-breakage-form-submit\" role=\"button\">", "</button>\n                    </div>\n                    <div class=\"breakage-form__footer token-breakage-form-body\">\n                        ", "\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n    </section>"])), (0, _topNav.topNav)({
+  return (0, _bel["default"])(_templateObject || (_templateObject = _taggedTemplateLiteral(["<section class=\"sliding-subview\">\n        <div class=\"breakage-form\">\n        ", "\n        <div class=\"padding-x-double js-breakage-form-element\" data-state=\"idle\">\n            <div class=\"key-insight\">\n                ", "\n                <div class=\"breakage-form__advise\">\n                    <p class=\"token-title-3\">", "</p>\n                </div>\n                <div class=\"breakage-form__message\">\n                    <p class=\"token-title-3-em\">", "</p>\n                    <p class=\"token-title-3\">", "</p>\n                </div>\n            </div>\n            <div class=\"breakage-form__content\">\n                <div class=\"breakage-form__element\">\n                    <div class=\"form__group\">\n                        <div class=\"form__select breakage-form__input--dropdown\">\n                            <select class=\"js-breakage-form-dropdown\">\n                                <option value=''>", "</option>\n                                ", "\n                            </select>\n                        </div>\n                        <textarea class=\"form__textarea js-breakage-form-description\" placeholder=\"", "\" maxlength=\"2500\"></textarea>\n                        <button class=\"form__submit token-label-em js-breakage-form-submit\" role=\"button\">", "</button>\n                    </div>\n                    <div class=\"breakage-form__footer token-breakage-form-body\">\n                        ", "\n                    </div>\n                </div>\n            </div>\n        </div>\n    </div>\n    </section>"])), (0, _topNav.topNav)({
     view: 'secondary'
   }), icon, _localize.i18n.t('report:selectTheOptionDesc.title'), _localize.i18n.t('report:thankYou.title'), _localize.i18n.t('report:yourReportWillHelpDesc.title'), _localize.i18n.t('report:pickYourIssueFromTheList.title'), categories.map(function (item) {
     return (0, _bel["default"])(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["<option value=", ">", "</option>"])), item.value, item.category);

package.json

@@ -27,6 +27,7 @@
         "test.int.headed": "playwright test --headed",
         "test.int.update-screenshots": "npm run test.int -- --update-snapshots",
         "test.int-debug": "playwright test --headed --debug",
+        "test.clean-tree": "npm run build && sh scripts/check-for-changes.sh",
         "verify.local": "npm run lint.fix; npm run prettier.fix; npm run test.unit; npm run build; npm run docs; npm run test.int"
     },
     "devDependencies": {

scripts/check-for-changes.sh

@@ -0,0 +1,2 @@
+git update-index --refresh 
+git diff-index --quiet HEAD --

shared/js/ui/templates/breakage-form.es6.js

@@ -45,7 +45,7 @@ export default function () {
                         </div>
                         <textarea class="form__textarea js-breakage-form-description" placeholder="${i18n.t(
                             'report:tellUsMoreDesc.title'
-                        )}"></textarea>
+                        )}" maxlength="2500"></textarea>
                         <button class="form__submit token-label-em js-breakage-form-submit" role="button">${i18n.t(
                             'report:sendReport.title'
                         )}</button>