import {StageComponent} from 'aurelia-testing';
import {SyntaxHighlighter} from '../../src/syntax-highlighter';

describe('SyntaxHighlighter', () => {
  let component;

  beforeEach(() => {
    component = StageComponent
      .withResources('src/syntax-highlighter')
      .inView(`<pre><code class="language-css" au-syntax>
.splash {
  text-align: center;
  margin: 10% 0 0 0;
  box-sizing: border-box;
}</code></pre>`);
  });

  afterEach(() => {
    component.dispose();
  });
});

@@ -41,16 +41,34 @@
 sting';%0A
+import 'prismjs';%0A
 import %7B
@@ -123,16 +123,16 @@
 ghter';%0A
-
 %0Adescrib
@@ -168,11 +168,11 @@
 %7B%0A  
-let
+var
  com
@@ -336,17 +336,16 @@
 -syntax%3E
-%0A
 .splash 
@@ -452,32 +452,32 @@
 terEach(() =%3E %7B%0A
-
     component.di
@@ -490,13 +490,234 @@
 );%0A  %7D);
+%0A%0A  it('highlights the given syntax', done =%3E %7B%0A    spyOn(Prism, 'highlightElement');%0A    component.create()%0A      .then(() =%3E %7B%0A        expect(Prism.highlightElement).toHaveBeenCalled();%0A      %7D)%0A      .then(done);%0A  %7D);
 %0A%7D);%0A

add syntax highlighting attribute test