PageRenderTime 39ms CodeModel.GetById 10ms RepoModel.GetById 0ms app.codeStats 0ms

/training-web/vendor/bundle/gems/sass-3.2.9/test/sass/conversion_test.rb

https://bitbucket.org/ohimmelreich/asalia-training
Ruby | 1743 lines | 1519 code | 210 blank | 14 comment | 5 complexity | dc2ddf1e98da5c62915e608f012e46fb MD5 | raw file
  1. #!/usr/bin/env ruby
  2. require File.dirname(__FILE__) + '/../test_helper'
  3. class ConversionTest < Test::Unit::TestCase
  4. def test_basic
  5. assert_renders <<SASS, <<SCSS
  6. foo bar
  7. baz: bang
  8. bip: bop
  9. SASS
  10. foo bar {
  11. baz: bang;
  12. bip: bop;
  13. }
  14. SCSS
  15. assert_renders <<SASS, <<SCSS, :old => true
  16. foo bar
  17. :baz bang
  18. :bip bop
  19. SASS
  20. foo bar {
  21. baz: bang;
  22. bip: bop;
  23. }
  24. SCSS
  25. end
  26. def test_empty_selector
  27. assert_renders "foo bar", "foo bar {}"
  28. end
  29. def test_empty_directive
  30. assert_scss_to_sass "@media screen", "@media screen {}"
  31. assert_scss_to_scss "@media screen {}"
  32. end
  33. def test_empty_control_directive
  34. assert_renders "@if false", "@if false {}"
  35. end
  36. def test_nesting
  37. assert_renders <<SASS, <<SCSS
  38. foo bar
  39. baz bang
  40. baz: bang
  41. bip: bop
  42. blat: boo
  43. SASS
  44. foo bar {
  45. baz bang {
  46. baz: bang;
  47. bip: bop;
  48. }
  49. blat: boo;
  50. }
  51. SCSS
  52. end
  53. def test_nesting_with_parent_ref
  54. assert_renders <<SASS, <<SCSS
  55. foo bar
  56. &:hover
  57. baz: bang
  58. SASS
  59. foo bar {
  60. &:hover {
  61. baz: bang;
  62. }
  63. }
  64. SCSS
  65. end
  66. def test_selector_interpolation
  67. assert_renders <<SASS, <<SCSS
  68. foo \#{$bar + "baz"}.bip
  69. baz: bang
  70. foo /\#{$bar + "baz"}/ .bip
  71. baz: bang
  72. SASS
  73. foo \#{$bar + "baz"}.bip {
  74. baz: bang;
  75. }
  76. foo /\#{$bar + "baz"}/ .bip {
  77. baz: bang;
  78. }
  79. SCSS
  80. end
  81. def test_multiline_selector_with_commas
  82. assert_renders <<SASS, <<SCSS
  83. foo bar,
  84. baz bang
  85. baz: bang
  86. SASS
  87. foo bar,
  88. baz bang {
  89. baz: bang;
  90. }
  91. SCSS
  92. assert_renders <<SASS, <<SCSS
  93. blat
  94. foo bar,
  95. baz bang
  96. baz: bang
  97. SASS
  98. blat {
  99. foo bar,
  100. baz bang {
  101. baz: bang;
  102. }
  103. }
  104. SCSS
  105. end
  106. def test_multiline_selector_without_commas
  107. assert_scss_to_sass <<SASS, <<SCSS
  108. foo bar baz bang
  109. baz: bang
  110. SASS
  111. foo bar
  112. baz bang {
  113. baz: bang;
  114. }
  115. SCSS
  116. assert_scss_to_scss <<SCSS
  117. foo bar
  118. baz bang {
  119. baz: bang;
  120. }
  121. SCSS
  122. end
  123. def test_escaped_selector
  124. assert_renders <<SASS, <<SCSS
  125. foo bar
  126. \\:hover
  127. baz: bang
  128. SASS
  129. foo bar {
  130. :hover {
  131. baz: bang;
  132. }
  133. }
  134. SCSS
  135. end
  136. def test_property_name_interpolation
  137. assert_renders <<SASS, <<SCSS
  138. foo bar
  139. baz\#{$bang}bip\#{$bop}: 12
  140. SASS
  141. foo bar {
  142. baz\#{$bang}bip\#{$bop}: 12;
  143. }
  144. SCSS
  145. end
  146. def test_property_value_interpolation
  147. assert_renders <<SASS, <<SCSS
  148. foo bar
  149. baz: 12 \#{$bang} bip \#{"bop"} blat
  150. SASS
  151. foo bar {
  152. baz: 12 \#{$bang} bip \#{"bop"} blat;
  153. }
  154. SCSS
  155. end
  156. def test_dynamic_properties
  157. assert_renders <<SASS, <<SCSS
  158. foo bar
  159. baz: 12 $bang "bip"
  160. SASS
  161. foo bar {
  162. baz: 12 $bang "bip";
  163. }
  164. SCSS
  165. end
  166. def test_dynamic_properties_with_old
  167. assert_renders <<SASS, <<SCSS, :old => true
  168. foo bar
  169. :baz 12 $bang "bip"
  170. SASS
  171. foo bar {
  172. baz: 12 $bang "bip";
  173. }
  174. SCSS
  175. end
  176. def test_multiline_properties
  177. assert_scss_to_sass <<SASS, <<SCSS
  178. foo bar
  179. baz: bip bam boon
  180. SASS
  181. foo bar {
  182. baz:
  183. bip
  184. bam
  185. boon;
  186. }
  187. SCSS
  188. assert_scss_to_scss <<OUT, <<IN
  189. foo bar {
  190. baz: bip bam boon;
  191. }
  192. OUT
  193. foo bar {
  194. baz:
  195. bip
  196. bam
  197. boon;
  198. }
  199. IN
  200. end
  201. def test_multiline_dynamic_properties
  202. assert_scss_to_sass <<SASS, <<SCSS
  203. foo bar
  204. baz: $bip "bam" 12px
  205. SASS
  206. foo bar {
  207. baz:
  208. $bip
  209. "bam"
  210. 12px;
  211. }
  212. SCSS
  213. assert_scss_to_scss <<OUT, <<IN
  214. foo bar {
  215. baz: $bip "bam" 12px;
  216. }
  217. OUT
  218. foo bar {
  219. baz:
  220. $bip
  221. "bam"
  222. 12px;
  223. }
  224. IN
  225. end
  226. def test_silent_comments
  227. assert_renders <<SASS, <<SCSS
  228. // foo
  229. // bar
  230. // baz
  231. foo bar
  232. a: b
  233. SASS
  234. // foo
  235. // bar
  236. // baz
  237. foo bar {
  238. a: b;
  239. }
  240. SCSS
  241. assert_renders <<SASS, <<SCSS
  242. // foo
  243. // bar
  244. // baz
  245. // bang
  246. foo bar
  247. a: b
  248. SASS
  249. // foo
  250. // bar
  251. // baz
  252. // bang
  253. foo bar {
  254. a: b;
  255. }
  256. SCSS
  257. assert_sass_to_scss <<SCSS, <<SASS
  258. // foo
  259. // bar
  260. // baz
  261. // bang
  262. foo bar {
  263. a: b;
  264. }
  265. SCSS
  266. // foo
  267. // bar
  268. // baz
  269. // bang
  270. foo bar
  271. a: b
  272. SASS
  273. end
  274. def test_nested_silent_comments
  275. assert_renders <<SASS, <<SCSS
  276. foo
  277. bar: baz
  278. // bip bop
  279. // beep boop
  280. bang: bizz
  281. // bubble bubble
  282. // toil trouble
  283. SASS
  284. foo {
  285. bar: baz;
  286. // bip bop
  287. // beep boop
  288. bang: bizz;
  289. // bubble bubble
  290. // toil trouble
  291. }
  292. SCSS
  293. assert_sass_to_scss <<SCSS, <<SASS
  294. foo {
  295. bar: baz;
  296. // bip bop
  297. // beep boop
  298. // bap blimp
  299. bang: bizz;
  300. // bubble bubble
  301. // toil trouble
  302. // gorp
  303. }
  304. SCSS
  305. foo
  306. bar: baz
  307. // bip bop
  308. beep boop
  309. bap blimp
  310. bang: bizz
  311. // bubble bubble
  312. toil trouble
  313. gorp
  314. SASS
  315. end
  316. def test_loud_comments
  317. assert_renders <<SASS, <<SCSS
  318. /* foo
  319. /* bar
  320. /* baz
  321. foo bar
  322. a: b
  323. SASS
  324. /* foo */
  325. /* bar */
  326. /* baz */
  327. foo bar {
  328. a: b;
  329. }
  330. SCSS
  331. assert_scss_to_sass <<SASS, <<SCSS
  332. /* foo
  333. * bar
  334. * baz
  335. * bang
  336. foo bar
  337. a: b
  338. SASS
  339. /* foo
  340. bar
  341. baz
  342. bang */
  343. foo bar {
  344. a: b;
  345. }
  346. SCSS
  347. assert_scss_to_scss <<SCSS
  348. /* foo
  349. bar
  350. baz
  351. bang */
  352. foo bar {
  353. a: b;
  354. }
  355. SCSS
  356. assert_renders <<SASS, <<SCSS
  357. /* foo
  358. * bar
  359. * baz
  360. * bang
  361. foo bar
  362. a: b
  363. SASS
  364. /* foo
  365. * bar
  366. * baz
  367. * bang */
  368. foo bar {
  369. a: b;
  370. }
  371. SCSS
  372. end
  373. def test_nested_loud_comments
  374. assert_renders <<SASS, <<SCSS
  375. foo
  376. bar: baz
  377. /* bip bop
  378. * beep boop
  379. bang: bizz
  380. /* bubble bubble
  381. * toil trouble
  382. SASS
  383. foo {
  384. bar: baz;
  385. /* bip bop
  386. * beep boop */
  387. bang: bizz;
  388. /* bubble bubble
  389. * toil trouble */
  390. }
  391. SCSS
  392. assert_sass_to_scss <<SCSS, <<SASS
  393. foo {
  394. bar: baz;
  395. /* bip bop
  396. * beep boop
  397. * bap blimp */
  398. bang: bizz;
  399. /* bubble bubble
  400. * toil trouble
  401. * gorp */
  402. }
  403. SCSS
  404. foo
  405. bar: baz
  406. /* bip bop
  407. beep boop
  408. bap blimp
  409. bang: bizz
  410. /* bubble bubble
  411. toil trouble
  412. gorp
  413. SASS
  414. end
  415. def test_loud_comments_with_weird_indentation
  416. assert_scss_to_sass <<SASS, <<SCSS
  417. foo
  418. /* foo
  419. * bar
  420. * baz
  421. a: b
  422. SASS
  423. foo {
  424. /* foo
  425. bar
  426. baz */
  427. a: b;
  428. }
  429. SCSS
  430. assert_sass_to_scss <<SCSS, <<SASS
  431. foo {
  432. /* foo
  433. * bar
  434. * baz */
  435. a: b;
  436. }
  437. SCSS
  438. foo
  439. /* foo
  440. bar
  441. baz
  442. a: b
  443. SASS
  444. end
  445. def test_immediately_preceding_comments
  446. assert_renders <<SASS, <<SCSS
  447. /* Foo
  448. * Bar
  449. * Baz
  450. .foo#bar
  451. a: b
  452. SASS
  453. /* Foo
  454. * Bar
  455. * Baz */
  456. .foo#bar {
  457. a: b;
  458. }
  459. SCSS
  460. assert_renders <<SASS, <<SCSS
  461. // Foo
  462. // Bar
  463. // Baz
  464. =foo
  465. a: b
  466. SASS
  467. // Foo
  468. // Bar
  469. // Baz
  470. @mixin foo {
  471. a: b;
  472. }
  473. SCSS
  474. end
  475. def test_debug
  476. assert_renders <<SASS, <<SCSS
  477. foo
  478. @debug 12px
  479. bar: baz
  480. SASS
  481. foo {
  482. @debug 12px;
  483. bar: baz;
  484. }
  485. SCSS
  486. end
  487. def test_directive_without_children
  488. assert_renders <<SASS, <<SCSS
  489. foo
  490. @foo #bar "baz"
  491. bar: baz
  492. SASS
  493. foo {
  494. @foo #bar "baz";
  495. bar: baz;
  496. }
  497. SCSS
  498. end
  499. def test_directive_with_prop_children
  500. assert_renders <<SASS, <<SCSS
  501. foo
  502. @foo #bar "baz"
  503. a: b
  504. c: d
  505. bar: baz
  506. SASS
  507. foo {
  508. @foo #bar "baz" {
  509. a: b;
  510. c: d;
  511. }
  512. bar: baz;
  513. }
  514. SCSS
  515. end
  516. def test_directive_with_rule_children
  517. assert_renders <<SASS, <<SCSS
  518. foo
  519. @foo #bar "baz"
  520. #blat
  521. a: b
  522. .bang
  523. c: d
  524. e: f
  525. bar: baz
  526. SASS
  527. foo {
  528. @foo #bar "baz" {
  529. #blat {
  530. a: b;
  531. }
  532. .bang {
  533. c: d;
  534. e: f;
  535. }
  536. }
  537. bar: baz;
  538. }
  539. SCSS
  540. end
  541. def test_directive_with_rule_and_prop_children
  542. assert_renders <<SASS, <<SCSS
  543. foo
  544. @foo #bar "baz"
  545. g: h
  546. #blat
  547. a: b
  548. .bang
  549. c: d
  550. e: f
  551. i: j
  552. bar: baz
  553. SASS
  554. foo {
  555. @foo #bar "baz" {
  556. g: h;
  557. #blat {
  558. a: b;
  559. }
  560. .bang {
  561. c: d;
  562. e: f;
  563. }
  564. i: j;
  565. }
  566. bar: baz;
  567. }
  568. SCSS
  569. end
  570. def test_charset
  571. assert_renders <<SASS, <<SCSS
  572. @charset "utf-8"
  573. SASS
  574. @charset "utf-8";
  575. SCSS
  576. end
  577. def test_for
  578. assert_renders <<SASS, <<SCSS
  579. foo
  580. @for $a from $b to $c
  581. a: b
  582. @for $c from 1 to 16
  583. d: e
  584. f: g
  585. SASS
  586. foo {
  587. @for $a from $b to $c {
  588. a: b;
  589. }
  590. @for $c from 1 to 16 {
  591. d: e;
  592. f: g;
  593. }
  594. }
  595. SCSS
  596. end
  597. def test_while
  598. assert_renders <<SASS, <<SCSS
  599. foo
  600. @while flaz($a + $b)
  601. a: b
  602. @while 1
  603. d: e
  604. f: g
  605. SASS
  606. foo {
  607. @while flaz($a + $b) {
  608. a: b;
  609. }
  610. @while 1 {
  611. d: e;
  612. f: g;
  613. }
  614. }
  615. SCSS
  616. end
  617. def test_if
  618. assert_renders <<SASS, <<SCSS
  619. foo
  620. @if $foo or $bar
  621. a: b
  622. @if $baz
  623. d: e
  624. @else if $bang
  625. f: g
  626. @else
  627. h: i
  628. SASS
  629. foo {
  630. @if $foo or $bar {
  631. a: b;
  632. }
  633. @if $baz {
  634. d: e;
  635. }
  636. @else if $bang {
  637. f: g;
  638. }
  639. @else {
  640. h: i;
  641. }
  642. }
  643. SCSS
  644. end
  645. def test_each
  646. assert_renders <<SASS, <<SCSS
  647. a
  648. @each $number in 1px 2px 3px 4px
  649. b: $number
  650. c
  651. @each $str in foo, bar, baz, bang
  652. d: $str
  653. SASS
  654. a {
  655. @each $number in 1px 2px 3px 4px {
  656. b: $number;
  657. }
  658. }
  659. c {
  660. @each $str in foo, bar, baz, bang {
  661. d: $str;
  662. }
  663. }
  664. SCSS
  665. end
  666. def test_import
  667. assert_renders <<SASS, <<SCSS
  668. @import foo
  669. @import url(bar.css)
  670. foo
  671. bar: baz
  672. SASS
  673. @import "foo";
  674. @import url(bar.css);
  675. foo {
  676. bar: baz;
  677. }
  678. SCSS
  679. assert_renders <<SASS, <<SCSS
  680. @import foo.css
  681. @import url(bar.css)
  682. foo
  683. bar: baz
  684. SASS
  685. @import "foo.css";
  686. @import url(bar.css);
  687. foo {
  688. bar: baz;
  689. }
  690. SCSS
  691. end
  692. def test_import_as_directive_in_sass
  693. assert_equal "@import foo.css\n", to_sass('@import "foo.css"')
  694. end
  695. def test_import_as_directive_in_scss
  696. assert_renders <<SASS, <<SCSS
  697. @import "foo.css" print
  698. SASS
  699. @import "foo.css" print;
  700. SCSS
  701. assert_renders <<SASS, <<SCSS
  702. @import url(foo.css) screen, print
  703. SASS
  704. @import url(foo.css) screen, print;
  705. SCSS
  706. end
  707. def test_adjacent_imports
  708. assert_renders <<SASS, <<SCSS
  709. @import foo.sass
  710. @import bar.scss
  711. @import baz
  712. SASS
  713. @import "foo.sass";
  714. @import "bar.scss";
  715. @import "baz";
  716. SCSS
  717. end
  718. def test_non_adjacent_imports
  719. assert_renders <<SASS, <<SCSS
  720. @import foo.sass
  721. @import bar.scss
  722. @import baz
  723. SASS
  724. @import "foo.sass";
  725. @import "bar.scss";
  726. @import "baz";
  727. SCSS
  728. end
  729. def test_import_with_interpolation
  730. assert_renders <<SASS, <<SCSS
  731. $family: unquote("Droid+Sans")
  732. @import url("http://fonts.googleapis.com/css?family=\#{$family}")
  733. SASS
  734. $family: unquote("Droid+Sans");
  735. @import url("http://fonts.googleapis.com/css?family=\#{$family}");
  736. SCSS
  737. end
  738. def test_extend
  739. assert_renders <<SASS, <<SCSS
  740. .foo
  741. @extend .bar
  742. @extend .baz:bang
  743. SASS
  744. .foo {
  745. @extend .bar;
  746. @extend .baz:bang;
  747. }
  748. SCSS
  749. end
  750. def test_comma_extendee
  751. assert_renders <<SASS, <<SCSS
  752. .baz
  753. @extend .foo, .bar
  754. SASS
  755. .baz {
  756. @extend .foo, .bar;
  757. }
  758. SCSS
  759. end
  760. def test_argless_mixin_definition
  761. assert_renders <<SASS, <<SCSS
  762. =foo-bar
  763. baz
  764. a: b
  765. SASS
  766. @mixin foo-bar {
  767. baz {
  768. a: b;
  769. }
  770. }
  771. SCSS
  772. assert_scss_to_sass <<SASS, <<SCSS
  773. =foo-bar
  774. baz
  775. a: b
  776. SASS
  777. @mixin foo-bar() {
  778. baz {
  779. a: b;
  780. }
  781. }
  782. SCSS
  783. assert_sass_to_scss <<SCSS, <<SASS
  784. @mixin foo-bar {
  785. baz {
  786. a: b;
  787. }
  788. }
  789. SCSS
  790. =foo-bar()
  791. baz
  792. a: b
  793. SASS
  794. end
  795. def test_mixin_definition_without_defaults
  796. assert_renders <<SASS, <<SCSS
  797. =foo-bar($baz, $bang)
  798. baz
  799. a: $baz $bang
  800. SASS
  801. @mixin foo-bar($baz, $bang) {
  802. baz {
  803. a: $baz $bang;
  804. }
  805. }
  806. SCSS
  807. end
  808. def test_mixin_definition_with_defaults
  809. assert_renders <<SASS, <<SCSS
  810. =foo-bar($baz, $bang: 12px)
  811. baz
  812. a: $baz $bang
  813. SASS
  814. @mixin foo-bar($baz, $bang: 12px) {
  815. baz {
  816. a: $baz $bang;
  817. }
  818. }
  819. SCSS
  820. assert_sass_to_scss <<SCSS, <<SASS
  821. @mixin foo-bar($baz, $bang: foo) {
  822. baz {
  823. a: $baz $bang;
  824. }
  825. }
  826. SCSS
  827. =foo-bar($baz, $bang: foo)
  828. baz
  829. a: $baz $bang
  830. SASS
  831. end
  832. def test_argless_mixin_include
  833. assert_renders <<SASS, <<SCSS
  834. foo
  835. +foo-bar
  836. a: blip
  837. SASS
  838. foo {
  839. @include foo-bar;
  840. a: blip;
  841. }
  842. SCSS
  843. end
  844. def test_mixin_include
  845. assert_renders <<SASS, <<SCSS
  846. foo
  847. +foo-bar(12px, "blaz")
  848. a: blip
  849. SASS
  850. foo {
  851. @include foo-bar(12px, "blaz");
  852. a: blip;
  853. }
  854. SCSS
  855. end
  856. def test_mixin_include_with_keyword_args
  857. assert_renders <<SASS, <<SCSS
  858. foo
  859. +foo-bar(12px, "blaz", $blip: blap, $bloop: blop)
  860. +foo-bar($blip: blap, $bloop: blop)
  861. a: blip
  862. SASS
  863. foo {
  864. @include foo-bar(12px, "blaz", $blip: blap, $bloop: blop);
  865. @include foo-bar($blip: blap, $bloop: blop);
  866. a: blip;
  867. }
  868. SCSS
  869. end
  870. def test_argless_function_definition
  871. assert_renders <<SASS, <<SCSS
  872. @function foo()
  873. $var: 1 + 1
  874. @return $var
  875. SASS
  876. @function foo() {
  877. $var: 1 + 1;
  878. @return $var;
  879. }
  880. SCSS
  881. end
  882. def test_function_definition_without_defaults
  883. assert_renders <<SASS, <<SCSS
  884. @function foo($var1, $var2)
  885. @if $var1
  886. @return $var1 + $var2
  887. SASS
  888. @function foo($var1, $var2) {
  889. @if $var1 {
  890. @return $var1 + $var2;
  891. }
  892. }
  893. SCSS
  894. end
  895. def test_function_definition_with_defaults
  896. assert_renders <<SASS, <<SCSS
  897. @function foo($var1, $var2: foo)
  898. @if $var1
  899. @return $var1 + $var2
  900. SASS
  901. @function foo($var1, $var2: foo) {
  902. @if $var1 {
  903. @return $var1 + $var2;
  904. }
  905. }
  906. SCSS
  907. end
  908. def test_variable_definition
  909. assert_renders <<SASS, <<SCSS
  910. $var1: 12px + 15px
  911. foo
  912. $var2: flaz(#abcdef)
  913. val: $var1 $var2
  914. SASS
  915. $var1: 12px + 15px;
  916. foo {
  917. $var2: flaz(#abcdef);
  918. val: $var1 $var2;
  919. }
  920. SCSS
  921. end
  922. def test_guarded_variable_definition
  923. assert_renders <<SASS, <<SCSS
  924. $var1: 12px + 15px !default
  925. foo
  926. $var2: flaz(#abcdef) !default
  927. val: $var1 $var2
  928. SASS
  929. $var1: 12px + 15px !default;
  930. foo {
  931. $var2: flaz(#abcdef) !default;
  932. val: $var1 $var2;
  933. }
  934. SCSS
  935. end
  936. def test_multiple_variable_definitions
  937. assert_renders <<SASS, <<SCSS
  938. $var1: foo
  939. $var2: bar
  940. $var3: baz
  941. $var4: bip
  942. $var5: bap
  943. SASS
  944. $var1: foo;
  945. $var2: bar;
  946. $var3: baz;
  947. $var4: bip;
  948. $var5: bap;
  949. SCSS
  950. end
  951. def test_division_asserted_with_parens
  952. assert_renders <<SASS, <<SCSS
  953. foo
  954. a: (1px / 2px)
  955. SASS
  956. foo {
  957. a: (1px / 2px);
  958. }
  959. SCSS
  960. end
  961. def test_division_not_asserted_when_unnecessary
  962. assert_renders <<SASS, <<SCSS
  963. $var: 1px / 2px
  964. foo
  965. a: $var
  966. SASS
  967. $var: 1px / 2px;
  968. foo {
  969. a: $var;
  970. }
  971. SCSS
  972. assert_renders <<SASS, <<SCSS
  973. $var: 1px
  974. foo
  975. a: $var / 2px
  976. SASS
  977. $var: 1px;
  978. foo {
  979. a: $var / 2px;
  980. }
  981. SCSS
  982. assert_renders <<SASS, <<SCSS
  983. foo
  984. a: 1 + 1px / 2px
  985. SASS
  986. foo {
  987. a: 1 + 1px / 2px;
  988. }
  989. SCSS
  990. end
  991. def test_literal_slash
  992. assert_renders <<SASS, <<SCSS
  993. foo
  994. a: 1px / 2px
  995. SASS
  996. foo {
  997. a: 1px / 2px;
  998. }
  999. SCSS
  1000. end
  1001. def test_directive_with_interpolation
  1002. assert_renders <<SASS, <<SCSS
  1003. $baz: 12
  1004. @foo bar\#{$baz} qux
  1005. a: b
  1006. SASS
  1007. $baz: 12;
  1008. @foo bar\#{$baz} qux {
  1009. a: b;
  1010. }
  1011. SCSS
  1012. end
  1013. def test_media_with_interpolation
  1014. assert_renders <<SASS, <<SCSS
  1015. $baz: 12
  1016. @media bar\#{$baz}
  1017. a: b
  1018. SASS
  1019. $baz: 12;
  1020. @media bar\#{$baz} {
  1021. a: b;
  1022. }
  1023. SCSS
  1024. end
  1025. def test_media_with_expressions
  1026. assert_sass_to_scss <<SCSS, <<SASS
  1027. $media1: screen;
  1028. $media2: print;
  1029. $var: -webkit-min-device-pixel-ratio;
  1030. $val: 20;
  1031. @media \#{$media1} and ($var + "-foo": $val + 5), only \#{$media2} {
  1032. a: b;
  1033. }
  1034. SCSS
  1035. $media1: screen
  1036. $media2: print
  1037. $var: -webkit-min-device-pixel-ratio
  1038. $val: 20
  1039. @media \#{$media1} and ($var + "-foo": $val + 5), only \#{$media2}
  1040. a: b
  1041. SASS
  1042. assert_scss_to_sass <<SASS, <<SCSS
  1043. $media1: screen
  1044. $media2: print
  1045. $var: -webkit-min-device-pixel-ratio
  1046. $val: 20
  1047. @media \#{$media1} and ($var + "-foo": $val + 5), only \#{$media2}
  1048. a: b
  1049. SASS
  1050. $media1: screen;
  1051. $media2: print;
  1052. $var: -webkit-min-device-pixel-ratio;
  1053. $val: 20;
  1054. @media \#{$media1} and ($var + "-foo": $val + 5), only \#{$media2} {
  1055. a: b;
  1056. }
  1057. SCSS
  1058. end
  1059. def test_supports_with_expressions
  1060. assert_renders <<SASS, <<SCSS
  1061. $query: "(feature1: val)"
  1062. $feature: feature2
  1063. $val: val
  1064. @supports \#{$query} and ($feature: $val) or (not ($feature + 3: $val + 4))
  1065. foo
  1066. a: b
  1067. SASS
  1068. $query: "(feature1: val)";
  1069. $feature: feature2;
  1070. $val: val;
  1071. @supports \#{$query} and ($feature: $val) or (not ($feature + 3: $val + 4)) {
  1072. foo {
  1073. a: b;
  1074. }
  1075. }
  1076. SCSS
  1077. end
  1078. # Hacks
  1079. def test_declaration_hacks
  1080. assert_renders <<SASS, <<SCSS
  1081. foo
  1082. _name: val
  1083. *name: val
  1084. #name: val
  1085. .name: val
  1086. name/**/: val
  1087. name/*\\**/: val
  1088. name: val
  1089. SASS
  1090. foo {
  1091. _name: val;
  1092. *name: val;
  1093. #name: val;
  1094. .name: val;
  1095. name/**/: val;
  1096. name/*\\**/: val;
  1097. name: val;
  1098. }
  1099. SCSS
  1100. end
  1101. def test_old_declaration_hacks
  1102. assert_renders <<SASS, <<SCSS, :old => true
  1103. foo
  1104. :_name val
  1105. :*name val
  1106. :#name val
  1107. :.name val
  1108. :name val
  1109. SASS
  1110. foo {
  1111. _name: val;
  1112. *name: val;
  1113. #name: val;
  1114. .name: val;
  1115. name: val;
  1116. }
  1117. SCSS
  1118. end
  1119. def test_selector_hacks
  1120. assert_selector_renders = lambda do |s|
  1121. assert_renders <<SASS, <<SCSS
  1122. #{s}
  1123. a: b
  1124. SASS
  1125. #{s} {
  1126. a: b;
  1127. }
  1128. SCSS
  1129. end
  1130. assert_selector_renders['> E']
  1131. assert_selector_renders['+ E']
  1132. assert_selector_renders['~ E']
  1133. assert_selector_renders['> > E']
  1134. assert_selector_renders['E*']
  1135. assert_selector_renders['E*.foo']
  1136. assert_selector_renders['E*:hover']
  1137. end
  1138. def test_disallowed_colon_hack
  1139. assert_raise_message(Sass::SyntaxError, 'The ":name: val" hack is not allowed in the Sass indented syntax') do
  1140. to_sass("foo {:name: val;}", :syntax => :scss)
  1141. end
  1142. end
  1143. def test_nested_properties
  1144. assert_renders <<SASS, <<SCSS
  1145. div
  1146. before: before
  1147. background:
  1148. color: blue
  1149. repeat: no-repeat
  1150. after: after
  1151. SASS
  1152. div {
  1153. before: before;
  1154. background: {
  1155. color: blue;
  1156. repeat: no-repeat;
  1157. };
  1158. after: after;
  1159. }
  1160. SCSS
  1161. end
  1162. def test_dasherize
  1163. assert_sass_to_scss(<<SCSS, <<SASS, :dasherize => true)
  1164. @mixin under-scored-mixin($under-scored-arg: $under-scored-default) {
  1165. bar: $under-scored-arg;
  1166. }
  1167. div {
  1168. foo: under-scored-fn($under-scored-var + "before\#{$another-under-scored-var}after");
  1169. @include under-scored-mixin($passed-arg);
  1170. selector-\#{$under-scored-interp}: bold;
  1171. }
  1172. @if $under-scored {
  1173. @for $for-var from $from-var to $to-var {
  1174. @while $while-var == true {
  1175. $while-var: false;
  1176. }
  1177. }
  1178. }
  1179. SCSS
  1180. =under_scored_mixin($under_scored_arg: $under_scored_default)
  1181. bar: $under_scored_arg
  1182. div
  1183. foo: under_scored_fn($under_scored_var + "before\#{$another_under_scored_var}after")
  1184. +under_scored_mixin($passed_arg)
  1185. selector-\#{$under_scored_interp}: bold
  1186. @if $under_scored
  1187. @for $for_var from $from_var to $to_var
  1188. @while $while_var == true
  1189. $while_var : false
  1190. SASS
  1191. end
  1192. def test_loud_comment_conversion
  1193. assert_renders(<<SASS, <<SCSS)
  1194. /*! \#{"interpolated"}
  1195. SASS
  1196. /*! \#{"interpolated"} */
  1197. SCSS
  1198. end
  1199. def test_content_conversion
  1200. assert_renders(<<SASS, <<SCSS)
  1201. $color: blue
  1202. =context($class, $color: red)
  1203. .\#{$class}
  1204. background-color: $color
  1205. @content
  1206. border-color: $color
  1207. +context(parent)
  1208. +context(child, $color: yellow)
  1209. color: $color
  1210. SASS
  1211. $color: blue;
  1212. @mixin context($class, $color: red) {
  1213. .\#{$class} {
  1214. background-color: $color;
  1215. @content;
  1216. border-color: $color;
  1217. }
  1218. }
  1219. @include context(parent) {
  1220. @include context(child, $color: yellow) {
  1221. color: $color;
  1222. }
  1223. }
  1224. SCSS
  1225. end
  1226. def test_empty_content
  1227. assert_scss_to_scss(<<SCSS)
  1228. @mixin foo {
  1229. @content;
  1230. }
  1231. @include foo {}
  1232. SCSS
  1233. end
  1234. def test_placeholder_conversion
  1235. assert_renders(<<SASS, <<SCSS)
  1236. #content a%foo.bar
  1237. color: blue
  1238. SASS
  1239. #content a%foo.bar {
  1240. color: blue;
  1241. }
  1242. SCSS
  1243. end
  1244. def test_reference_selector
  1245. assert_renders(<<SASS, <<SCSS)
  1246. foo /bar|baz/ bang
  1247. a: b
  1248. SASS
  1249. foo /bar|baz/ bang {
  1250. a: b;
  1251. }
  1252. SCSS
  1253. end
  1254. def test_subject
  1255. assert_renders(<<SASS, <<SCSS)
  1256. foo bar! baz
  1257. a: b
  1258. SASS
  1259. foo bar! baz {
  1260. a: b;
  1261. }
  1262. SCSS
  1263. end
  1264. def test_placeholder_interoplation_conversion
  1265. assert_renders(<<SASS, <<SCSS)
  1266. $foo: foo
  1267. %\#{$foo}
  1268. color: blue
  1269. .bar
  1270. @extend %foo
  1271. SASS
  1272. $foo: foo;
  1273. %\#{$foo} {
  1274. color: blue;
  1275. }
  1276. .bar {
  1277. @extend %foo;
  1278. }
  1279. SCSS
  1280. end
  1281. def test_indent
  1282. assert_renders <<SASS, <<SCSS, :indent => " "
  1283. foo bar
  1284. baz bang
  1285. baz: bang
  1286. bip: bop
  1287. blat: boo
  1288. SASS
  1289. foo bar {
  1290. baz bang {
  1291. baz: bang;
  1292. bip: bop;
  1293. }
  1294. blat: boo;
  1295. }
  1296. SCSS
  1297. assert_renders <<SASS, <<SCSS, :indent => "\t"
  1298. foo bar
  1299. baz bang
  1300. baz: bang
  1301. bip: bop
  1302. blat: boo
  1303. SASS
  1304. foo bar {
  1305. baz bang {
  1306. baz: bang;
  1307. bip: bop;
  1308. }
  1309. blat: boo;
  1310. }
  1311. SCSS
  1312. assert_sass_to_scss <<SCSS, <<SASS, :indent => " "
  1313. foo bar {
  1314. baz bang {
  1315. baz: bang;
  1316. bip: bop;
  1317. }
  1318. blat: boo;
  1319. }
  1320. SCSS
  1321. foo bar
  1322. baz bang
  1323. baz: bang
  1324. bip: bop
  1325. blat: boo
  1326. SASS
  1327. assert_sass_to_scss <<SCSS, <<SASS, :indent => "\t"
  1328. foo bar {
  1329. baz bang {
  1330. baz: bang;
  1331. bip: bop;
  1332. }
  1333. blat: boo;
  1334. }
  1335. SCSS
  1336. foo bar
  1337. baz bang
  1338. baz: bang
  1339. bip: bop
  1340. blat: boo
  1341. SASS
  1342. assert_scss_to_sass <<SASS, <<SCSS, :indent => " "
  1343. foo bar
  1344. baz bang
  1345. baz: bang
  1346. bip: bop
  1347. blat: boo
  1348. SASS
  1349. foo bar {
  1350. baz bang {
  1351. baz: bang;
  1352. bip: bop;
  1353. }
  1354. blat: boo;
  1355. }
  1356. SCSS
  1357. assert_scss_to_sass <<SASS, <<SCSS, :indent => "\t"
  1358. foo bar
  1359. baz bang
  1360. baz: bang
  1361. bip: bop
  1362. blat: boo
  1363. SASS
  1364. foo bar {
  1365. baz bang {
  1366. baz: bang;
  1367. bip: bop;
  1368. }
  1369. blat: boo;
  1370. }
  1371. SCSS
  1372. end
  1373. def test_extend_with_optional
  1374. assert_scss_to_sass <<SASS, <<SCSS
  1375. foo
  1376. @extend .bar !optional
  1377. SASS
  1378. foo {
  1379. @extend .bar !optional;
  1380. }
  1381. SCSS
  1382. end
  1383. def test_mixin_var_args
  1384. assert_scss_to_sass <<SASS, <<SCSS
  1385. =foo($args...)
  1386. a: b
  1387. =bar($a, $args...)
  1388. a: b
  1389. .foo
  1390. +foo($list...)
  1391. +bar(1, $list...)
  1392. SASS
  1393. @mixin foo($args...) {
  1394. a: b;
  1395. }
  1396. @mixin bar($a, $args...) {
  1397. a: b;
  1398. }
  1399. .foo {
  1400. @include foo($list...);
  1401. @include bar(1, $list...);
  1402. }
  1403. SCSS
  1404. end
  1405. def test_function_var_args
  1406. assert_scss_to_sass <<SASS, <<SCSS
  1407. @function foo($args...)
  1408. @return foo
  1409. @function bar($a, $args...)
  1410. @return bar
  1411. .foo
  1412. a: foo($list...)
  1413. b: bar(1, $list...)
  1414. SASS
  1415. @function foo($args...) {
  1416. @return foo;
  1417. }
  1418. @function bar($a, $args...) {
  1419. @return bar;
  1420. }
  1421. .foo {
  1422. a: foo($list...);
  1423. b: bar(1, $list...);
  1424. }
  1425. SCSS
  1426. end
  1427. ## Regression Tests
  1428. def test_list_in_args
  1429. assert_renders(<<SASS, <<SCSS)
  1430. +mixin((a, b, c))
  1431. +mixin($arg: (a, b, c))
  1432. +mixin(a, b, (c, d, e)...)
  1433. SASS
  1434. @include mixin((a, b, c));
  1435. @include mixin($arg: (a, b, c));
  1436. @include mixin(a, b, (c, d, e)...);
  1437. SCSS
  1438. end
  1439. def test_media_query_with_expr
  1440. assert_scss_to_sass <<SASS, <<SCSS
  1441. @media foo and (bar: baz)
  1442. a: b
  1443. SASS
  1444. @media foo and (bar: baz) {
  1445. a: b; }
  1446. SCSS
  1447. end
  1448. def test_nested_if_statements
  1449. assert_renders(<<SASS, <<SCSS)
  1450. @if $foo
  1451. one
  1452. a: b
  1453. @else
  1454. @if $bar
  1455. two
  1456. a: b
  1457. @else
  1458. three
  1459. a: b
  1460. SASS
  1461. @if $foo {
  1462. one {
  1463. a: b;
  1464. }
  1465. }
  1466. @else {
  1467. @if $bar {
  1468. two {
  1469. a: b;
  1470. }
  1471. }
  1472. @else {
  1473. three {
  1474. a: b;
  1475. }
  1476. }
  1477. }
  1478. SCSS
  1479. end
  1480. def test_comment_indentation
  1481. assert_renders(<<SASS, <<SCSS, :indent => ' ')
  1482. foo
  1483. // bar
  1484. /* baz
  1485. a: b
  1486. SASS
  1487. foo {
  1488. // bar
  1489. /* baz */
  1490. a: b;
  1491. }
  1492. SCSS
  1493. end
  1494. private
  1495. def assert_sass_to_sass(sass, options = {})
  1496. assert_equal(sass.rstrip, to_sass(sass, options).rstrip,
  1497. "Expected Sass to transform to itself")
  1498. end
  1499. def assert_scss_to_sass(sass, scss, options = {})
  1500. assert_equal(sass.rstrip, to_sass(scss, options.merge(:syntax => :scss)).rstrip,
  1501. "Expected SCSS to transform to Sass")
  1502. end
  1503. def assert_scss_to_scss(scss, in_scss = nil, options = nil)
  1504. if in_scss.is_a?(Hash)
  1505. options = in_scss
  1506. in_scss = nil
  1507. end
  1508. in_scss ||= scss
  1509. options ||= {}
  1510. assert_equal(scss.rstrip, to_scss(in_scss, options.merge(:syntax => :scss)).rstrip,
  1511. "Expected SCSS to transform to #{scss == in_scss ? 'itself' : 'SCSS'}")
  1512. end
  1513. def assert_sass_to_scss(scss, sass, options = {})
  1514. assert_equal(scss.rstrip, to_scss(sass, options).rstrip,
  1515. "Expected Sass to transform to SCSS")
  1516. end
  1517. def assert_renders(sass, scss, options = {})
  1518. assert_sass_to_sass(sass, options)
  1519. assert_scss_to_sass(sass, scss, options)
  1520. assert_scss_to_scss(scss, options)
  1521. assert_sass_to_scss(scss, sass, options)
  1522. end
  1523. def to_sass(scss, options = {})
  1524. Sass::Util.silence_sass_warnings do
  1525. Sass::Engine.new(scss, options).to_tree.to_sass(options)
  1526. end
  1527. end
  1528. def to_scss(sass, options = {})
  1529. Sass::Util.silence_sass_warnings do
  1530. Sass::Engine.new(sass, options).to_tree.to_scss(options)
  1531. end
  1532. end
  1533. end