selectField.spec.jsx.snap 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435
  1. // Jest Snapshot v1, https://goo.gl/fbAQLP
  2. exports[`SelectField renders with flat choices 1`] = `
  3. <div
  4. className=""
  5. >
  6. <div
  7. className="controls"
  8. >
  9. <StyledSelectControl
  10. choices={
  11. Array [
  12. "a",
  13. "b",
  14. "c",
  15. ]
  16. }
  17. clearable={true}
  18. disabled={false}
  19. height={36}
  20. id="id-fieldName"
  21. multiple={false}
  22. name="fieldName"
  23. onChange={[Function]}
  24. required={false}
  25. value="fieldValue"
  26. />
  27. </div>
  28. </div>
  29. `;
  30. exports[`SelectField renders with paired choices 1`] = `
  31. <div
  32. className=""
  33. >
  34. <div
  35. className="controls"
  36. >
  37. <StyledSelectControl
  38. choices={
  39. Array [
  40. Array [
  41. "a",
  42. "abc",
  43. ],
  44. Array [
  45. "b",
  46. "bcd",
  47. ],
  48. Array [
  49. "c",
  50. "cde",
  51. ],
  52. ]
  53. }
  54. clearable={true}
  55. disabled={false}
  56. height={36}
  57. id="id-fieldName"
  58. multiple={false}
  59. name="fieldName"
  60. onChange={[Function]}
  61. required={false}
  62. value="fieldValue"
  63. />
  64. </div>
  65. </div>
  66. `;
  67. exports[`SelectField renders without form context 1`] = `
  68. <SelectField
  69. clearable={true}
  70. disabled={false}
  71. hideErrorMessage={false}
  72. multiple={false}
  73. name="fieldName"
  74. options={
  75. Array [
  76. Object {
  77. "label": "a",
  78. "value": "a",
  79. },
  80. Object {
  81. "label": "b",
  82. "value": "b",
  83. },
  84. ]
  85. }
  86. required={false}
  87. value="a"
  88. >
  89. <div
  90. className=""
  91. >
  92. <div
  93. className="controls"
  94. >
  95. <StyledSelectControl
  96. clearable={true}
  97. disabled={false}
  98. height={36}
  99. id="id-fieldName"
  100. multiple={false}
  101. name="fieldName"
  102. onChange={[Function]}
  103. options={
  104. Array [
  105. Object {
  106. "label": "a",
  107. "value": "a",
  108. },
  109. Object {
  110. "label": "b",
  111. "value": "b",
  112. },
  113. ]
  114. }
  115. required={false}
  116. value="a"
  117. >
  118. <SelectControl
  119. className="css-j6zs66-StyledSelectControl e1qrhqd00"
  120. clearable={true}
  121. disabled={false}
  122. height={36}
  123. id="id-fieldName"
  124. multiple={false}
  125. name="fieldName"
  126. onChange={[Function]}
  127. options={
  128. Array [
  129. Object {
  130. "label": "a",
  131. "value": "a",
  132. },
  133. Object {
  134. "label": "b",
  135. "value": "b",
  136. },
  137. ]
  138. }
  139. required={false}
  140. value="a"
  141. >
  142. <StyledSelect
  143. arrowRenderer={[Function]}
  144. backspaceRemoves={true}
  145. className="css-j6zs66-StyledSelectControl e1qrhqd00"
  146. clearable={true}
  147. deleteRemoves={true}
  148. disabled={false}
  149. height={36}
  150. id="id-fieldName"
  151. multiple={false}
  152. name="fieldName"
  153. onChange={[Function]}
  154. options={
  155. Array [
  156. Object {
  157. "label": "a",
  158. "value": "a",
  159. },
  160. Object {
  161. "label": "b",
  162. "value": "b",
  163. },
  164. ]
  165. }
  166. required={false}
  167. value="a"
  168. >
  169. <ForwardRef(SelectPicker)
  170. arrowRenderer={[Function]}
  171. backspaceRemoves={true}
  172. className="e1qrhqd00 css-1cl3z8x-StyledSelect-StyledSelectControl eho28m20"
  173. clearable={true}
  174. deleteRemoves={true}
  175. disabled={false}
  176. height={36}
  177. id="id-fieldName"
  178. multiple={false}
  179. name="fieldName"
  180. onChange={[Function]}
  181. options={
  182. Array [
  183. Object {
  184. "label": "a",
  185. "value": "a",
  186. },
  187. Object {
  188. "label": "b",
  189. "value": "b",
  190. },
  191. ]
  192. }
  193. required={false}
  194. value="a"
  195. >
  196. <SelectPicker
  197. arrowRenderer={[Function]}
  198. backspaceRemoves={true}
  199. className="e1qrhqd00 css-1cl3z8x-StyledSelect-StyledSelectControl eho28m20"
  200. clearable={true}
  201. deleteRemoves={true}
  202. disabled={false}
  203. forwardedRef={null}
  204. height={36}
  205. id="id-fieldName"
  206. multiple={false}
  207. name="fieldName"
  208. onChange={[Function]}
  209. options={
  210. Array [
  211. Object {
  212. "label": "a",
  213. "value": "a",
  214. },
  215. Object {
  216. "label": "b",
  217. "value": "b",
  218. },
  219. ]
  220. }
  221. required={false}
  222. value="a"
  223. >
  224. <Select
  225. arrowRenderer={[Function]}
  226. autosize={true}
  227. backspaceRemoves={true}
  228. backspaceToRemoveMessage="Press backspace to remove {label}"
  229. className="e1qrhqd00 css-1cl3z8x-StyledSelect-StyledSelectControl eho28m20"
  230. clearAllText="Clear all"
  231. clearRenderer={[Function]}
  232. clearValueText="Clear value"
  233. clearable={true}
  234. closeOnSelect={true}
  235. deleteRemoves={true}
  236. delimiter=","
  237. disabled={false}
  238. escapeClearsValue={true}
  239. filterOptions={[Function]}
  240. height={36}
  241. id="id-fieldName"
  242. ignoreAccents={true}
  243. ignoreCase={true}
  244. inputProps={Object {}}
  245. isLoading={false}
  246. joinValues={false}
  247. labelKey="label"
  248. matchPos="any"
  249. matchProp="any"
  250. menuBuffer={0}
  251. menuRenderer={[Function]}
  252. multi={false}
  253. multiple={false}
  254. name="fieldName"
  255. noResultsText="No results found"
  256. onBlurResetsInput={true}
  257. onChange={[Function]}
  258. onCloseResetsInput={true}
  259. onSelectResetsInput={true}
  260. openOnClick={true}
  261. optionComponent={[Function]}
  262. options={
  263. Array [
  264. Object {
  265. "label": "a",
  266. "value": "a",
  267. },
  268. Object {
  269. "label": "b",
  270. "value": "b",
  271. },
  272. ]
  273. }
  274. pageSize={5}
  275. placeholder="Select..."
  276. removeSelected={true}
  277. required={false}
  278. rtl={false}
  279. scrollMenuIntoView={true}
  280. searchable={true}
  281. simpleValue={false}
  282. tabSelectsValue={true}
  283. trimFilter={true}
  284. value="a"
  285. valueComponent={[Function]}
  286. valueKey="value"
  287. >
  288. <div
  289. className="Select e1qrhqd00 css-1cl3z8x-StyledSelect-StyledSelectControl eho28m20 has-value is-clearable is-searchable Select--single"
  290. >
  291. <input
  292. disabled={false}
  293. key="hidden.0"
  294. name="fieldName"
  295. type="hidden"
  296. value="a"
  297. />
  298. <div
  299. className="Select-control"
  300. onKeyDown={[Function]}
  301. onMouseDown={[Function]}
  302. onTouchEnd={[Function]}
  303. onTouchMove={[Function]}
  304. onTouchStart={[Function]}
  305. >
  306. <span
  307. className="Select-multi-value-wrapper"
  308. id="react-select-2--value"
  309. >
  310. <Value
  311. disabled={false}
  312. id="react-select-2--value-item"
  313. instancePrefix="react-select-2-"
  314. onClick={null}
  315. placeholder="Select..."
  316. value={
  317. Object {
  318. "label": "a",
  319. "value": "a",
  320. }
  321. }
  322. >
  323. <div
  324. className="Select-value"
  325. >
  326. <span
  327. aria-selected="true"
  328. className="Select-value-label"
  329. id="react-select-2--value-item"
  330. role="option"
  331. >
  332. a
  333. </span>
  334. </div>
  335. </Value>
  336. <AutosizeInput
  337. aria-activedescendant="react-select-2--value"
  338. aria-expanded="false"
  339. aria-haspopup="false"
  340. aria-owns=""
  341. className="Select-input"
  342. id="id-fieldName"
  343. injectStyles={true}
  344. minWidth="5"
  345. onBlur={[Function]}
  346. onChange={[Function]}
  347. onFocus={[Function]}
  348. required={false}
  349. role="combobox"
  350. value=""
  351. >
  352. <div
  353. className="Select-input"
  354. style={
  355. Object {
  356. "display": "inline-block",
  357. }
  358. }
  359. >
  360. <input
  361. aria-activedescendant="react-select-2--value"
  362. aria-expanded="false"
  363. aria-haspopup="false"
  364. aria-owns=""
  365. id="id-fieldName"
  366. onBlur={[Function]}
  367. onChange={[Function]}
  368. onFocus={[Function]}
  369. required={false}
  370. role="combobox"
  371. style={
  372. Object {
  373. "boxSizing": "content-box",
  374. "width": "5px",
  375. }
  376. }
  377. value=""
  378. />
  379. <div
  380. style={
  381. Object {
  382. "height": 0,
  383. "left": 0,
  384. "overflow": "scroll",
  385. "position": "absolute",
  386. "top": 0,
  387. "visibility": "hidden",
  388. "whiteSpace": "pre",
  389. }
  390. }
  391. />
  392. </div>
  393. </AutosizeInput>
  394. </span>
  395. <span
  396. aria-label="Clear value"
  397. className="Select-clear-zone"
  398. onMouseDown={[Function]}
  399. onTouchEnd={[Function]}
  400. onTouchMove={[Function]}
  401. onTouchStart={[Function]}
  402. title="Clear value"
  403. >
  404. <span
  405. className="Select-clear"
  406. dangerouslySetInnerHTML={
  407. Object {
  408. "__html": "&times;",
  409. }
  410. }
  411. />
  412. </span>
  413. <span
  414. className="Select-arrow-zone"
  415. onMouseDown={[Function]}
  416. >
  417. <span
  418. className="icon-arrow-down"
  419. />
  420. </span>
  421. </div>
  422. </div>
  423. </Select>
  424. </SelectPicker>
  425. </ForwardRef(SelectPicker)>
  426. </StyledSelect>
  427. </SelectControl>
  428. </StyledSelectControl>
  429. </div>
  430. </div>
  431. </SelectField>
  432. `;