borderstyles.js 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593
  1. /**
  2. * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. import Styles, { StylesProcessor } from '../../../src/view/styles';
  6. import { addBorderStylesProcessor } from '../../../src/view/styles/borderstyles';
  7. describe( 'Border styles normalization', () => {
  8. let styles;
  9. beforeEach( () => {
  10. const converter = new StylesProcessor();
  11. addBorderStylesProcessor( converter );
  12. styles = new Styles( converter );
  13. } );
  14. it( 'should parse border shorthand', () => {
  15. styles.setStyle( 'border:1px solid blue;' );
  16. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  17. color: { top: 'blue', right: 'blue', bottom: 'blue', left: 'blue' },
  18. style: { top: 'solid', right: 'solid', bottom: 'solid', left: 'solid' },
  19. width: { top: '1px', right: '1px', bottom: '1px', left: '1px' }
  20. } );
  21. } );
  22. it( 'should parse border shorthand with only style', () => {
  23. styles.setStyle( 'border:solid;' );
  24. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  25. color: { top: undefined, right: undefined, bottom: undefined, left: undefined },
  26. style: { top: 'solid', right: 'solid', bottom: 'solid', left: 'solid' },
  27. width: { top: undefined, right: undefined, bottom: undefined, left: undefined }
  28. } );
  29. } );
  30. it( 'should parse border shorthand with other shorthands', () => {
  31. styles.setStyle( 'border:1px solid blue;border-left:#665511 dashed 2.7em;border-top:7px dotted #ccc;' );
  32. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  33. color: { top: '#ccc', right: 'blue', bottom: 'blue', left: '#665511' },
  34. style: { top: 'dotted', right: 'solid', bottom: 'solid', left: 'dashed' },
  35. width: { top: '7px', right: '1px', bottom: '1px', left: '2.7em' }
  36. } );
  37. } );
  38. it( 'should parse border longhand', () => {
  39. styles.setStyle( 'border-color: #f00 #ba2;' +
  40. 'border-style: solid;' +
  41. 'border-width: 1px;' +
  42. 'border-bottom-width: 2px;' +
  43. 'border-right-style: dotted;' );
  44. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  45. color: { top: '#f00', right: '#ba2', bottom: '#f00', left: '#ba2' },
  46. style: { top: 'solid', right: 'dotted', bottom: 'solid', left: 'solid' },
  47. width: { top: '1px', right: '1px', bottom: '2px', left: '1px' }
  48. } );
  49. } );
  50. it( 'should output inline shorthand rules #1', () => {
  51. styles.setStyle( 'border:1px solid blue;' );
  52. expect( styles.getInlineStyle() ).to.equal(
  53. 'border-top:1px solid blue;border-right:1px solid blue;border-bottom:1px solid blue;border-left:1px solid blue;'
  54. );
  55. expect( styles.getInlineProperty( 'border-color' ) ).to.equal( 'blue' );
  56. expect( styles.getInlineProperty( 'border-style' ) ).to.equal( 'solid' );
  57. expect( styles.getInlineProperty( 'border-width' ) ).to.equal( '1px' );
  58. } );
  59. it( 'should output only defined inline styles', () => {
  60. styles.insertProperty( 'border-color', { top: 'blue' } );
  61. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  62. color: { top: 'blue' }
  63. } );
  64. expect( styles.getInlineStyle( 'border' ) ).to.equal( 'border-top:blue;' );
  65. // TODO: expect( styles.hasProperty( 'border-top-color' ) ).to.be.true;
  66. // expect( styles.getInlineProperty( 'border-top-color' ) ).to.equal( 'blue' );
  67. } );
  68. it( 'should output inline shorthand rules #2', () => {
  69. styles.setStyle( 'border:1px solid blue;border-left:#665511 dashed 2.7em;border-top:7px dotted #ccc;' );
  70. expect( styles.getInlineStyle() ).to.equal(
  71. 'border-top:7px dotted #ccc;border-right:1px solid blue;border-bottom:1px solid blue;border-left:2.7em dashed #665511;'
  72. );
  73. expect( styles.getInlineProperty( 'border' ) ).to.be.undefined;
  74. expect( styles.getInlineProperty( 'border-color' ) ).to.equal( '#ccc blue blue #665511' );
  75. expect( styles.getInlineProperty( 'border-style' ) ).to.equal( 'dotted solid solid dashed' );
  76. expect( styles.getInlineProperty( 'border-width' ) ).to.equal( '7px 1px 1px 2.7em' );
  77. } );
  78. it( 'should parse border + border-position(only color defined)', () => {
  79. styles.setStyle( 'border:1px solid blue;border-left:#665511;' );
  80. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  81. color: { top: 'blue', right: 'blue', bottom: 'blue', left: '#665511' },
  82. style: { top: 'solid', right: 'solid', bottom: 'solid', left: 'solid' },
  83. width: { top: '1px', right: '1px', bottom: '1px', left: '1px' }
  84. } );
  85. } );
  86. it( 'should parse border + border-position(only style defined)', () => {
  87. styles.setStyle( 'border:1px solid blue;border-left:ridge;' );
  88. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  89. color: { top: 'blue', right: 'blue', bottom: 'blue', left: 'blue' },
  90. style: { top: 'solid', right: 'solid', bottom: 'solid', left: 'ridge' },
  91. width: { top: '1px', right: '1px', bottom: '1px', left: '1px' }
  92. } );
  93. } );
  94. it( 'should parse border + border-position(only width defined)', () => {
  95. styles.setStyle( 'border:1px solid blue;border-left:1337px' );
  96. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  97. color: { top: 'blue', right: 'blue', bottom: 'blue', left: 'blue' },
  98. style: { top: 'solid', right: 'solid', bottom: 'solid', left: 'solid' },
  99. width: { top: '1px', right: '1px', bottom: '1px', left: '1337px' }
  100. } );
  101. } );
  102. it( 'should merge rules on insert other shorthand', () => {
  103. styles.setStyle( 'border:1px solid blue;' );
  104. styles.insertProperty( 'border-left', '#665511 dashed 2.7em' );
  105. styles.insertProperty( 'border-top', '7px dotted #ccc' );
  106. expect( styles.getInlineStyle() ).to.equal(
  107. 'border-top:7px dotted #ccc;border-right:1px solid blue;border-bottom:1px solid blue;border-left:2.7em dashed #665511;'
  108. );
  109. expect( styles.getInlineProperty( 'border' ) ).to.be.undefined;
  110. expect( styles.getInlineProperty( 'border-color' ) ).to.equal( '#ccc blue blue #665511' );
  111. expect( styles.getInlineProperty( 'border-style' ) ).to.equal( 'dotted solid solid dashed' );
  112. expect( styles.getInlineProperty( 'border-width' ) ).to.equal( '7px 1px 1px 2.7em' );
  113. } );
  114. it( 'should output', () => {
  115. styles.setStyle( 'border:1px solid blue;' );
  116. styles.removeProperty( 'border-color' );
  117. expect( styles.getInlineStyle() ).to.equal(
  118. 'border-top:1px solid;border-right:1px solid;border-bottom:1px solid;border-left:1px solid;'
  119. );
  120. expect( styles.getInlineProperty( 'border' ) ).to.be.undefined;
  121. expect( styles.getInlineProperty( 'border-color' ) ).to.be.undefined;
  122. expect( styles.getInlineProperty( 'border-style' ) ).to.equal( 'solid' );
  123. expect( styles.getInlineProperty( 'border-width' ) ).to.equal( '1px' );
  124. expect( styles.getInlineProperty( 'border-top' ) ).to.equal( '1px solid' );
  125. expect( styles.getInlineProperty( 'border-right' ) ).to.equal( '1px solid' );
  126. expect( styles.getInlineProperty( 'border-bottom' ) ).to.equal( '1px solid' );
  127. expect( styles.getInlineProperty( 'border-left' ) ).to.equal( '1px solid' );
  128. } );
  129. it( 'should output border with only style shorthand (style)', () => {
  130. styles.setStyle( 'border:solid;' );
  131. expect( styles.getInlineStyle() ).to.equal( 'border-top:solid;border-right:solid;border-bottom:solid;border-left:solid;' );
  132. expect( styles.getInlineProperty( 'border' ) ).to.be.undefined;
  133. expect( styles.getInlineProperty( 'border-color' ) ).to.be.undefined;
  134. expect( styles.getInlineProperty( 'border-style' ) ).to.equal( 'solid' );
  135. expect( styles.getInlineProperty( 'border-width' ) ).to.be.undefined;
  136. expect( styles.getInlineProperty( 'border-top' ) ).to.equal( 'solid' );
  137. expect( styles.getInlineProperty( 'border-right' ) ).to.equal( 'solid' );
  138. expect( styles.getInlineProperty( 'border-bottom' ) ).to.equal( 'solid' );
  139. expect( styles.getInlineProperty( 'border-left' ) ).to.equal( 'solid' );
  140. } );
  141. it( 'should output border with only style shorthand (color)', () => {
  142. styles.setStyle( 'border:#f00;' );
  143. expect( styles.getInlineStyle() ).to.equal( 'border-top:#f00;border-right:#f00;border-bottom:#f00;border-left:#f00;' );
  144. expect( styles.getInlineProperty( 'border' ) ).to.be.undefined;
  145. expect( styles.getInlineProperty( 'border-color' ) ).to.equal( '#f00' );
  146. expect( styles.getInlineProperty( 'border-style' ) ).to.be.undefined;
  147. expect( styles.getInlineProperty( 'border-width' ) ).to.be.undefined;
  148. expect( styles.getInlineProperty( 'border-top' ) ).to.equal( '#f00' );
  149. expect( styles.getInlineProperty( 'border-right' ) ).to.equal( '#f00' );
  150. expect( styles.getInlineProperty( 'border-bottom' ) ).to.equal( '#f00' );
  151. expect( styles.getInlineProperty( 'border-left' ) ).to.equal( '#f00' );
  152. } );
  153. it( 'should output border with only style shorthand (width)', () => {
  154. styles.setStyle( 'border:1px;' );
  155. expect( styles.getInlineStyle() ).to.equal( 'border-top:1px;border-right:1px;border-bottom:1px;border-left:1px;' );
  156. expect( styles.getInlineProperty( 'border' ) ).to.be.undefined;
  157. expect( styles.getInlineProperty( 'border-color' ) ).to.be.undefined;
  158. expect( styles.getInlineProperty( 'border-style' ) ).to.be.undefined;
  159. expect( styles.getInlineProperty( 'border-width' ) ).to.equal( '1px' );
  160. expect( styles.getInlineProperty( 'border-top' ) ).to.equal( '1px' );
  161. expect( styles.getInlineProperty( 'border-right' ) ).to.equal( '1px' );
  162. expect( styles.getInlineProperty( 'border-bottom' ) ).to.equal( '1px' );
  163. expect( styles.getInlineProperty( 'border-left' ) ).to.equal( '1px' );
  164. } );
  165. describe( 'normalized values getters', () => {
  166. it( 'should output border-*-color', () => {
  167. styles.setStyle( 'border:1px solid #f00;' );
  168. [ 'top', 'right', 'bottom', 'left' ].forEach( position => {
  169. expect( styles.getNormalized( `border-${ position }-color` ) ).to.equal( '#f00' );
  170. } );
  171. } );
  172. it( 'should output border-*-width', () => {
  173. styles.setStyle( 'border:1px solid #f00;' );
  174. [ 'top', 'right', 'bottom', 'left' ].forEach( position => {
  175. expect( styles.getNormalized( `border-${ position }-width` ) ).to.equal( '1px' );
  176. } );
  177. } );
  178. it( 'should output border-*-style', () => {
  179. styles.setStyle( 'border:1px solid #f00;' );
  180. [ 'top', 'right', 'bottom', 'left' ].forEach( position => {
  181. expect( styles.getNormalized( `border-${ position }-style` ) ).to.equal( 'solid' );
  182. } );
  183. } );
  184. } );
  185. describe( 'border reducers', () => {
  186. it( 'should output border-top', () => {
  187. styles.setStyle( 'border:1px solid #f00' );
  188. expect( styles.getInlineProperty( 'border-top' ) ).to.equal( '1px solid #f00' );
  189. } );
  190. it( 'should output border-right', () => {
  191. styles.setStyle( 'border:1px solid #f00' );
  192. expect( styles.getInlineProperty( 'border-right' ) ).to.equal( '1px solid #f00' );
  193. } );
  194. it( 'should output border-bottom', () => {
  195. styles.setStyle( 'border:1px solid #f00' );
  196. expect( styles.getInlineProperty( 'border-bottom' ) ).to.equal( '1px solid #f00' );
  197. } );
  198. it( 'should output border-left', () => {
  199. styles.setStyle( 'border:1px solid #f00' );
  200. expect( styles.getInlineProperty( 'border-left' ) ).to.equal( '1px solid #f00' );
  201. } );
  202. } );
  203. describe( 'border-color', () => {
  204. it( 'should set all border colors (1 value defined)', () => {
  205. styles.setStyle( 'border-color:cyan;' );
  206. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  207. color: {
  208. top: 'cyan',
  209. right: 'cyan',
  210. bottom: 'cyan',
  211. left: 'cyan'
  212. }
  213. } );
  214. } );
  215. it( 'should set all border colors (2 values defined)', () => {
  216. styles.setStyle( 'border-color:cyan magenta;' );
  217. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  218. color: {
  219. top: 'cyan',
  220. right: 'magenta',
  221. bottom: 'cyan',
  222. left: 'magenta'
  223. }
  224. } );
  225. } );
  226. it( 'should set all border colors (3 values defined)', () => {
  227. styles.setStyle( 'border-color:cyan magenta pink;' );
  228. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  229. color: {
  230. top: 'cyan',
  231. right: 'magenta',
  232. bottom: 'pink',
  233. left: 'magenta'
  234. }
  235. } );
  236. } );
  237. it( 'should set all border colors (4 values defined)', () => {
  238. styles.setStyle( 'border-color:cyan magenta pink beige;' );
  239. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  240. color: {
  241. top: 'cyan',
  242. right: 'magenta',
  243. bottom: 'pink',
  244. left: 'beige'
  245. }
  246. } );
  247. } );
  248. it( 'should merge with border shorthand', () => {
  249. styles.setStyle( 'border:1px solid blue;border-color:cyan black;' );
  250. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  251. color: { top: 'cyan', right: 'black', bottom: 'cyan', left: 'black' },
  252. style: { top: 'solid', right: 'solid', bottom: 'solid', left: 'solid' },
  253. width: { top: '1px', right: '1px', bottom: '1px', left: '1px' }
  254. } );
  255. } );
  256. it( 'should parse #RGB color value', () => {
  257. styles.setStyle( 'border:#f00;' );
  258. expect( styles.getNormalized( 'border-color' ) ).to.deep.equal( {
  259. top: '#f00',
  260. right: '#f00',
  261. bottom: '#f00',
  262. left: '#f00'
  263. } );
  264. } );
  265. it( 'should parse #RGBA color value', () => {
  266. styles.setStyle( 'border:#f00A;' );
  267. expect( styles.getNormalized( 'border-color' ) ).to.deep.equal( {
  268. top: '#f00A',
  269. right: '#f00A',
  270. bottom: '#f00A',
  271. left: '#f00A'
  272. } );
  273. } );
  274. it( 'should parse rgb() color value', () => {
  275. styles.setStyle( 'border:rgb(0, 30%,35);' );
  276. expect( styles.getNormalized( 'border-color' ) ).to.deep.equal( {
  277. top: 'rgb(0, 30%, 35)',
  278. right: 'rgb(0, 30%, 35)',
  279. bottom: 'rgb(0, 30%, 35)',
  280. left: 'rgb(0, 30%, 35)'
  281. } );
  282. } );
  283. it( 'should parse hsl() color value', () => {
  284. styles.setStyle( 'border:hsl(0, 100%, 50%);' );
  285. expect( styles.getNormalized( 'border-color' ) ).to.deep.equal( {
  286. top: 'hsl(0, 100%, 50%)',
  287. right: 'hsl(0, 100%, 50%)',
  288. bottom: 'hsl(0, 100%, 50%)',
  289. left: 'hsl(0, 100%, 50%)'
  290. } );
  291. } );
  292. } );
  293. describe( 'border-style', () => {
  294. it( 'should set all border styles (1 value defined)', () => {
  295. styles.setStyle( 'border-style:solid;' );
  296. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  297. style: {
  298. top: 'solid',
  299. right: 'solid',
  300. bottom: 'solid',
  301. left: 'solid'
  302. }
  303. } );
  304. } );
  305. it( 'should set all border styles (2 values defined)', () => {
  306. styles.setStyle( 'border-style:solid dotted;' );
  307. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  308. style: {
  309. top: 'solid',
  310. right: 'dotted',
  311. bottom: 'solid',
  312. left: 'dotted'
  313. }
  314. } );
  315. } );
  316. it( 'should set all border styles (3 values defined)', () => {
  317. styles.setStyle( 'border-style:solid dotted dashed;' );
  318. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  319. style: {
  320. top: 'solid',
  321. right: 'dotted',
  322. bottom: 'dashed',
  323. left: 'dotted'
  324. }
  325. } );
  326. } );
  327. it( 'should set all border styles (4 values defined)', () => {
  328. styles.setStyle( 'border-style:solid dotted dashed ridge;' );
  329. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  330. style: {
  331. top: 'solid',
  332. right: 'dotted',
  333. bottom: 'dashed',
  334. left: 'ridge'
  335. }
  336. } );
  337. } );
  338. it( 'should parse none value', () => {
  339. styles.setStyle( 'border:none;' );
  340. expect( styles.getNormalized( 'border-style' ) ).to.deep.equal( {
  341. top: 'none',
  342. right: 'none',
  343. bottom: 'none',
  344. left: 'none'
  345. } );
  346. } );
  347. it( 'should parse line-style value', () => {
  348. styles.setStyle( 'border:solid;' );
  349. expect( styles.getNormalized( 'border-style' ) ).to.deep.equal( {
  350. top: 'solid',
  351. right: 'solid',
  352. bottom: 'solid',
  353. left: 'solid'
  354. } );
  355. } );
  356. it( 'should not parse non line-style value', () => {
  357. styles.setStyle( 'border:blue' );
  358. expect( styles.getNormalized( 'border-style' ) ).to.deep.equal( {
  359. top: undefined,
  360. right: undefined,
  361. bottom: undefined,
  362. left: undefined
  363. } );
  364. } );
  365. } );
  366. describe( 'border-width', () => {
  367. it( 'should set all border widths (1 value defined)', () => {
  368. styles.setStyle( 'border-width:1px;' );
  369. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  370. width: {
  371. top: '1px',
  372. right: '1px',
  373. bottom: '1px',
  374. left: '1px'
  375. }
  376. } );
  377. } );
  378. it( 'should set all border widths (2 values defined)', () => {
  379. styles.setStyle( 'border-width:1px .34cm;' );
  380. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  381. width: {
  382. top: '1px',
  383. right: '.34cm',
  384. bottom: '1px',
  385. left: '.34cm'
  386. }
  387. } );
  388. } );
  389. it( 'should set all border widths (3 values defined)', () => {
  390. styles.setStyle( 'border-width:1px .34cm 90.1rem;' );
  391. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  392. width: {
  393. top: '1px',
  394. right: '.34cm',
  395. bottom: '90.1rem',
  396. left: '.34cm'
  397. }
  398. } );
  399. } );
  400. it( 'should set all border widths (4 values defined)', () => {
  401. styles.setStyle( 'border-width:1px .34cm 90.1rem thick;' );
  402. expect( styles.getNormalized( 'border' ) ).to.deep.equal( {
  403. width: {
  404. top: '1px',
  405. right: '.34cm',
  406. bottom: '90.1rem',
  407. left: 'thick'
  408. }
  409. } );
  410. } );
  411. it( 'should parse px value', () => {
  412. styles.setStyle( 'border:1px;' );
  413. expect( styles.getNormalized( 'border-width' ) ).to.deep.equal( {
  414. top: '1px',
  415. right: '1px',
  416. bottom: '1px',
  417. left: '1px'
  418. } );
  419. } );
  420. it( 'should parse em value', () => {
  421. styles.setStyle( 'border:1em;' );
  422. expect( styles.getNormalized( 'border-width' ) ).to.deep.equal( {
  423. top: '1em',
  424. right: '1em',
  425. bottom: '1em',
  426. left: '1em'
  427. } );
  428. } );
  429. it( 'should parse thin value', () => {
  430. styles.setStyle( 'border:thin' );
  431. expect( styles.getNormalized( 'border-width' ) ).to.deep.equal( {
  432. top: 'thin',
  433. right: 'thin',
  434. bottom: 'thin',
  435. left: 'thin'
  436. } );
  437. } );
  438. it( 'should parse medium value', () => {
  439. styles.setStyle( 'border:medium' );
  440. expect( styles.getNormalized( 'border-width' ) ).to.deep.equal( {
  441. top: 'medium',
  442. right: 'medium',
  443. bottom: 'medium',
  444. left: 'medium'
  445. } );
  446. } );
  447. it( 'should parse thick value', () => {
  448. styles.setStyle( 'border:thick' );
  449. expect( styles.getNormalized( 'border-width' ) ).to.deep.equal( {
  450. top: 'thick',
  451. right: 'thick',
  452. bottom: 'thick',
  453. left: 'thick'
  454. } );
  455. } );
  456. } );
  457. describe( 'border-* position', () => {
  458. it( 'should output all positions', () => {
  459. styles.setStyle(
  460. 'border-top:none;' +
  461. 'border-left:none;' +
  462. 'border-bottom:dotted #FFC000 3.0pt;' +
  463. 'border-right:dotted #FFC000 3.0pt;'
  464. );
  465. expect( styles.getInlineStyle() ).to.equal(
  466. 'border-top:none;border-right:3.0pt dotted #FFC000;border-bottom:3.0pt dotted #FFC000;border-left:none;'
  467. );
  468. expect( styles.getInlineProperty( 'border-top' ) ).to.equal( 'none' );
  469. expect( styles.getInlineProperty( 'border-right' ) ).to.equal( '3.0pt dotted #FFC000' );
  470. expect( styles.getInlineProperty( 'border-bottom' ) ).to.equal( '3.0pt dotted #FFC000' );
  471. expect( styles.getInlineProperty( 'border-left' ) ).to.equal( 'none' );
  472. } );
  473. } );
  474. describe( 'getStyleNames() - border', () => {
  475. it( 'should set all border colors (1 value defined)', () => {
  476. styles.setStyle( 'border-color: deeppink deepskyblue;' +
  477. 'border-style: solid;' +
  478. 'border-width: 1px;' +
  479. 'border-bottom-width: 2px;' +
  480. 'border-right-style: dotted;' );
  481. expect( styles.getStyleNames() ).to.deep.equal( [
  482. 'border-top',
  483. 'border-right',
  484. 'border-bottom',
  485. 'border-left'
  486. ] );
  487. } );
  488. } );
  489. } );