improve required format messages for manual data fields. closes #388

dsifford · Dec 9, 2017 · 677e572 · 677e572
1 parent 01a02ff
commit 677e572
Show file tree

Hide file tree

Showing 8 changed files with 85 additions and 300 deletions.
diff --git a/lib/before-test.ts b/lib/before-test.ts
@@ -3,8 +3,8 @@ const { configure } = require('enzyme');
 import * as Adapter from 'enzyme-adapter-react-16';
 configure({ adapter: new Adapter() });
 
-const { i18n, state, wpInfo } = require('../fixtures.ts');
-const styles = require('../../src/vendor/citation-styles.json');
+const { i18n, state, wpInfo } = require('./fixtures.ts');
+const styles = require('../src/vendor/citation-styles.json');
 
 window.ABT = {
     state,

diff --git a/lib/types/ABT.d.ts b/lib/types/ABT.d.ts
@@ -97,12 +97,9 @@ declare namespace ABT {
         | 'translator'
         | 'recipient';
 
-    interface Field {
+    interface Field extends React.HTMLAttributes<HTMLInputElement> {
         value: string;
         label: string;
-        required: boolean;
-        pattern: string;
-        placeholder: string;
     }
 
     interface FieldMap {

diff --git a/package.json b/package.json
@@ -132,7 +132,7 @@
     "mapCoverage": true,
     "moduleDirectories": ["node_modules", "./src/js"],
     "moduleFileExtensions": ["ts", "tsx", "js"],
-    "setupFiles": ["raf/polyfill", "./lib/scripts/before-test.ts"],
+    "setupFiles": ["raf/polyfill", "./lib/before-test.ts"],
     "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
     "transform": {
       ".(ts|tsx)": "<rootDir>/node_modules/ts-jest/preprocessor.js"

diff --git a/src/js/dialogs/add/meta-fields.tsx b/src/js/dialogs/add/meta-fields.tsx
@@ -61,17 +61,16 @@ interface FieldProps {
 class Field extends React.Component<FieldProps, {}> {
     render(): JSX.Element {
         const { onChange, field, meta } = this.props;
+        const { label, value, ...attrs } = field;
         return (
             <div className="table__row">
-                <label htmlFor={field.value} children={field.label} />
+                <label htmlFor={value} children={label} />
                 <input
                     type="text"
                     onChange={onChange}
-                    id={field.value}
-                    value={meta.get(field.value) || ''}
-                    required={field.required}
-                    placeholder={field.placeholder}
-                    pattern={field.pattern}
+                    id={value}
+                    value={meta.get(value) || ''}
+                    {...attrs}
                 />
                 <style jsx>{`
                     div {

diff --git a/src/js/dialogs/pubmed/__tests__/__snapshots__/result-list-test.tsx.snap b/src/js/dialogs/pubmed/__tests__/__snapshots__/result-list-test.tsx.snap
@@ -6,6 +6,7 @@ exports[`<ResultList /> should match snapshots 1`] = `
   results={
     Array [
       Object {
+        "PMID": "1",
         "author": Array [
           Object {
             "family": "Doe",
@@ -38,6 +39,7 @@ exports[`<ResultList /> should match snapshots 1`] = `
         "title": "Test Title 1",
       },
       Object {
+        "PMID": "2",
         "author": Array [
           Object {
             "family": "Doe",

diff --git a/src/js/dialogs/pubmed/__tests__/result-list-test.tsx b/src/js/dialogs/pubmed/__tests__/result-list-test.tsx
@@ -3,7 +3,7 @@ import toJSON from 'enzyme-to-json';
 import * as React from 'react';
 import { ResultList } from '../result-list';
 
-const generateData = (n: number) => {
+const generateData = (n: number): any => {
     let data: Array<Partial<CSL.Data>> = [];
     for (let i = 0; i < n; i++) {
         data = [
@@ -21,6 +21,7 @@ const generateData = (n: number) => {
                 'container-title-short': `J Test ${i + 1}`,
                 title: `Test Title ${i + 1}`,
                 id: `${i + 1}`,
+                PMID: `${i + 1}`,
             },
         ];
     }
@@ -29,7 +30,7 @@ const generateData = (n: number) => {
 
 const defaultData = generateData(2);
 
-const setup = (data: any = defaultData, fullMount = true) => {
+const setup = (data: any = defaultData, fullMount = true): any => {
     const spy = jest.fn();
     const component = fullMount
         ? mount(<ResultList results={data} onSelect={spy} />)

diff --git a/src/js/reference-list/components/__tests__/__snapshots__/reference-list-test.tsx.snap b/src/js/reference-list/components/__tests__/__snapshots__/reference-list-test.tsx.snap
@@ -20,6 +20,7 @@ exports[`<ReferenceList /> snapshots cited and uncited list populated 1`] = `
         "bibOptions": Object {
           "heading": "",
           "headingLevel": "h3",
+          "links": "always",
           "style": "fixed",
         },
         "citationStyle": "american-medical-association",
@@ -32,7 +33,6 @@ exports[`<ReferenceList /> snapshots cited and uncited list populated 1`] = `
           },
           "byIndex": Array [],
         },
-        "links": "always",
         "locale": "en_US",
       }
     }
@@ -187,6 +187,7 @@ exports[`<ReferenceList /> snapshots cited and uncited list populated 2`] = `
         "bibOptions": Object {
           "heading": "",
           "headingLevel": "h3",
+          "links": "always",
           "style": "fixed",
         },
         "citationStyle": "american-medical-association",
@@ -221,7 +222,6 @@ exports[`<ReferenceList /> snapshots cited and uncited list populated 2`] = `
             },
           ],
         },
-        "links": "always",
         "locale": "en_US",
       }
     }
@@ -370,14 +370,14 @@ exports[`<ReferenceList /> snapshots initial mount with empty state 1`] = `
         "bibOptions": Object {
           "heading": "",
           "headingLevel": "h3",
+          "links": "always",
           "style": "fixed",
         },
         "citationStyle": "american-medical-association",
         "citations": CitationStore {
           "CSL": Object {},
           "byIndex": Array [],
         },
-        "links": "always",
         "locale": "en_US",
       }
     }
@@ -414,14 +414,14 @@ exports[`<ReferenceList /> snapshots initial mount with empty state 2`] = `
         "bibOptions": Object {
           "heading": "",
           "headingLevel": "h3",
+          "links": "always",
           "style": "fixed",
         },
         "citationStyle": "american-medical-association",
         "citations": CitationStore {
           "CSL": Object {},
           "byIndex": Array [],
         },
-        "links": "always",
         "locale": "en_US",
       }
     }
@@ -538,14 +538,14 @@ exports[`<ReferenceList /> snapshots menu toggled open 1`] = `
         "bibOptions": Object {
           "heading": "",
           "headingLevel": "h3",
+          "links": "always",
           "style": "fixed",
         },
         "citationStyle": "american-medical-association",
         "citations": CitationStore {
           "CSL": Object {},
           "byIndex": Array [],
         },
-        "links": "always",
         "locale": "en_US",
       }
     }
@@ -662,14 +662,14 @@ exports[`<ReferenceList /> snapshots pinned state toggled 1`] = `
         "bibOptions": Object {
           "heading": "",
           "headingLevel": "h3",
+          "links": "always",
           "style": "fixed",
         },
         "citationStyle": "american-medical-association",
         "citations": CitationStore {
           "CSL": Object {},
           "byIndex": Array [],
         },
-        "links": "always",
         "locale": "en_US",
       }
     }
@@ -770,6 +770,6 @@ exports[`<ReferenceList /> snapshots should match StorageField snapshot 1`] = `
 <input
   name="abt-reflist-state"
   type="hidden"
-  value="{\\"CSL\\":{},\\"cache\\":{\\"links\\":\\"always\\",\\"locale\\":\\"en_US\\",\\"style\\":\\"american-medical-association\\"},\\"citationByIndex\\":[]}"
+  value="{\\"CSL\\":{},\\"cache\\":{\\"locale\\":\\"en_US\\",\\"style\\":\\"american-medical-association\\"},\\"citationByIndex\\":[]}"
 />
 `;