title.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434
  1. describe('title', function() {
  2. var uiHelper = window.uiHelper;
  3. var suites = [{
  4. name: 'show',
  5. cases: [{
  6. name: 'should display given title by default',
  7. option: {
  8. series: [],
  9. title: {
  10. text: 'test title'
  11. }
  12. }
  13. }, {
  14. name: 'should hide title when show is false',
  15. option: {
  16. series: [],
  17. title: {
  18. text: 'hidden title',
  19. display: false
  20. }
  21. }
  22. }]
  23. }, {
  24. name: 'text',
  25. cases: [{
  26. name: 'should display title',
  27. option: {
  28. series: [],
  29. title: {
  30. text: 'here is a title'
  31. }
  32. }
  33. }, {
  34. name: 'should display long title in a line',
  35. option: {
  36. series: [],
  37. title: {
  38. text: 'here is a very long long long long long long long '
  39. + 'long long long long long long long long long long '
  40. + 'long long long long long long long long long title'
  41. }
  42. }
  43. }, {
  44. name: 'should run into a new line with \\n',
  45. option: {
  46. series: [],
  47. title: {
  48. text: 'first line\nsecond line'
  49. }
  50. }
  51. }, {
  52. name: 'should display no title by default',
  53. option: {
  54. series: []
  55. }
  56. }]
  57. }, {
  58. name: 'subtext',
  59. cases: [{
  60. name: 'should display subtext without text',
  61. option: {
  62. series: [],
  63. title: {
  64. subtext: 'subtext without text'
  65. }
  66. }
  67. }, {
  68. name: 'should display subtext with text',
  69. option: {
  70. series: [],
  71. title: {
  72. text: 'this is text',
  73. subtext: 'subtext without text'
  74. }
  75. }
  76. }]
  77. }, {
  78. name: 'padding',
  79. cases: [{
  80. name: 'should display padding 5px as default',
  81. test: 'equalOption',
  82. option1: {
  83. series: [],
  84. title: {
  85. text: 'this is title with 5px padding'
  86. }
  87. },
  88. option2: {
  89. series: [],
  90. title: {
  91. text: 'this is title with 5px padding',
  92. padding: 5
  93. }
  94. }
  95. }, {
  96. name: 'should display one-value padding',
  97. test: 'notEqualOption',
  98. option1: {
  99. series: [],
  100. title: {
  101. text: 'should display one-value padding'
  102. }
  103. },
  104. option2: {
  105. series: [],
  106. title: {
  107. text: 'should display one-value padding',
  108. padding: 50
  109. }
  110. }
  111. }, {
  112. name: 'should display two-value padding',
  113. test: 'notEqualOption',
  114. option1: {
  115. series: [],
  116. title: {
  117. text: 'display two-value padding'
  118. }
  119. },
  120. option2: {
  121. series: [],
  122. title: {
  123. text: 'display two-value padding',
  124. padding: [20, 50]
  125. }
  126. }
  127. }, {
  128. name: 'should display four-value padding',
  129. test: 'notEqualOption',
  130. option1: {
  131. series: [],
  132. title: {
  133. text: 'compare padding with 10, 30, 50, 70'
  134. }
  135. },
  136. option2: {
  137. series: [],
  138. title: {
  139. text: 'compare padding with 10, 30, 50, 70',
  140. padding: [10, 30, 50, 70]
  141. }
  142. }
  143. }, {
  144. name: 'should display four-value and two-value padding accordingly',
  145. test: 'equalOption',
  146. option1: {
  147. series: [],
  148. title: {
  149. text: 'compare padding with 20, 50 and 20, 50, 20, 50',
  150. padding: [20, 50]
  151. }
  152. },
  153. option2: {
  154. series: [],
  155. title: {
  156. text: 'compare padding with 20, 50 and 20, 50, 20, 50',
  157. padding: [20, 50, 20, 50]
  158. }
  159. }
  160. }]
  161. }, {
  162. name: 'itemGap',
  163. cases: [{
  164. name: 'should have default itemGap as 5px',
  165. test: 'equalOption',
  166. option1: {
  167. series: [],
  168. title: {
  169. text: 'title',
  170. subtext: 'subtext'
  171. }
  172. },
  173. option2: {
  174. series: [],
  175. title: {
  176. text: 'title',
  177. subtext: 'subtext',
  178. itemGap: 5
  179. }
  180. }
  181. }]
  182. }, {
  183. name: 'left',
  184. cases: [{
  185. name: 'should display left position',
  186. option: {
  187. series: [],
  188. title: {
  189. text: 'this is title',
  190. left: 50
  191. }
  192. }
  193. }, {
  194. name: 'should display at 20%',
  195. option: {
  196. series: [],
  197. title: {
  198. text: 'this is title',
  199. left: '20%'
  200. }
  201. }
  202. }, {
  203. name: 'should display at center',
  204. option: {
  205. series: [],
  206. title: {
  207. text: 'this is title',
  208. left: 'center'
  209. }
  210. }
  211. }, {
  212. name: 'should display at right',
  213. option: {
  214. series: [],
  215. title: {
  216. text: 'this is title',
  217. left: 'right'
  218. }
  219. }
  220. }]
  221. }, {
  222. name: 'top',
  223. cases: [{
  224. name: 'should display top position',
  225. option: {
  226. series: [],
  227. title: {
  228. text: 'this is title',
  229. top: 50
  230. }
  231. }
  232. }, {
  233. name: 'should display at 20%',
  234. option: {
  235. series: [],
  236. title: {
  237. text: 'this is title',
  238. top: '20%'
  239. }
  240. }
  241. }, {
  242. name: 'should display at middle',
  243. option: {
  244. series: [],
  245. title: {
  246. text: 'this is title',
  247. top: 'middle'
  248. }
  249. }
  250. }, {
  251. name: 'should display at bottom',
  252. option: {
  253. series: [],
  254. title: {
  255. text: 'this is title',
  256. top: 'bottom'
  257. }
  258. }
  259. }]
  260. }, {
  261. name: 'right',
  262. cases: [{
  263. name: 'should display right position',
  264. option: {
  265. series: [],
  266. title: {
  267. text: 'this is title',
  268. right: 50
  269. }
  270. }
  271. }]
  272. }, {
  273. name: 'bottom',
  274. cases: [{
  275. name: 'should display bottom position',
  276. option: {
  277. series: [],
  278. title: {
  279. text: 'this is title',
  280. bottom: 50
  281. }
  282. }
  283. }]
  284. }, {
  285. name: 'left and right',
  286. cases: [{
  287. name: 'are both set',
  288. test: 'equalOption',
  289. option1: {
  290. series: [],
  291. title: {
  292. text: 'this is title',
  293. left: 50,
  294. right: 50
  295. }
  296. },
  297. option2: {
  298. series: [],
  299. title: {
  300. text: 'this is title',
  301. left: 50
  302. }
  303. }
  304. }]
  305. }, {
  306. name: 'top and bottom',
  307. cases: [{
  308. name: 'are both set',
  309. test: 'equalOption',
  310. option1: {
  311. series: [],
  312. title: {
  313. text: 'this is title',
  314. top: 50,
  315. bottom: 50
  316. }
  317. },
  318. option2: {
  319. series: [],
  320. title: {
  321. text: 'this is title',
  322. top: 50
  323. }
  324. }
  325. }]
  326. }, {
  327. name: 'backgroundColor',
  328. cases: [{
  329. name: 'should show specific background color',
  330. option: {
  331. series: [],
  332. title: {
  333. text: 'this is title',
  334. backgroundColor: 'rgba(255, 100, 0, 0.2)'
  335. }
  336. }
  337. }]
  338. }, {
  339. name: 'borderColor',
  340. cases: [{
  341. name: 'should show specific border color at default border width',
  342. test: 'equalOption',
  343. option1: {
  344. series: [],
  345. title: {
  346. text: 'this is title',
  347. borderColor: '#f00'
  348. }
  349. },
  350. option2: {
  351. series: [],
  352. title: {
  353. text: 'this is title',
  354. borderColor: '#f00',
  355. borderWidth: 1
  356. }
  357. }
  358. }, {
  359. name: 'should display larger border width',
  360. option: {
  361. series: [],
  362. title: {
  363. text: 'this is title',
  364. borderWidth: 15
  365. }
  366. }
  367. }]
  368. }, {
  369. name: 'shadowBlur and shadowColor',
  370. cases: [{
  371. name: 'should display shadow blur',
  372. option: {
  373. series: [],
  374. title: {
  375. backgroundColor: 'green',
  376. text: 'this is title',
  377. shadowColor: 'red',
  378. shadowBlur: 5
  379. }
  380. }
  381. }]
  382. }, {
  383. name: 'shadowOffsetX',
  384. cases: [{
  385. name: 'should display shadow blur',
  386. option: {
  387. series: [],
  388. title: {
  389. backgroundColor: 'green',
  390. text: 'this is title',
  391. shadowColor: 'red',
  392. shadowBlur: 5,
  393. shadowOffsetX: 10
  394. }
  395. }
  396. }]
  397. }, {
  398. name: 'shadowOffsetY',
  399. cases: [{
  400. name: 'should display shadow blur',
  401. option: {
  402. series: [],
  403. title: {
  404. backgroundColor: 'green',
  405. text: 'this is title',
  406. shadowColor: 'red',
  407. shadowBlur: 5,
  408. shadowOffsetY: 10
  409. }
  410. }
  411. }]
  412. }, {
  413. name: 'shadowOffsetX and shadowOffsetY',
  414. cases: [{
  415. name: 'should display shadow blur',
  416. option: {
  417. series: [],
  418. title: {
  419. backgroundColor: 'green',
  420. text: 'this is title',
  421. shadowColor: 'red',
  422. shadowBlur: 5,
  423. shadowOffsetX: 10,
  424. shadowOffsetY: 10
  425. }
  426. }
  427. }]
  428. }];
  429. uiHelper.testOptionSpec('title', suites);
  430. });