all files / lib/__tests__/ dom.nested.test.js

74.07% Statements 20/27
0% Branches 0/6
72.73% Functions 8/11
74.07% Lines 20/27
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97                                                                                                                                                         
import assert from 'assert';
import React from 'react';
import TestUtils from 'react-addons-test-utils';
import DocumentMeta from '../';
import { removeDocumentMeta } from '../utils';
import { getElements, getAttr } from './test-utils';
 
const document = global.document;
 
describe('DocumentMeta - DOM nested', () => {
 
  const DOC_META = {
    title: 'This is a document title',
    description: 'This meta value is describing the page we are looking at',
    canonical: 'http://domain.tld/path/to/page',
    meta: {
      charset: 'utf-8',
      name: {
        keywords: 'react,document,meta,tags'
      }
    },
    link: {
      rel: {
        stylesheet: [
          'http://domain.tld/css/vendor.css',
          'http://domain.tld/css/styles.css'
        ]
      }
    }
  };
 
  const DOC_META_NESTED = {
    title: 'This is another document title',
    description: null,
    canonical: 'http://domain.tld/path/to/other',
    meta: {
      name: {
        keywords: 'react,document,meta,tags,nesting'
      }
    },
    link: {
      rel: {}
    }
  };
 
 
  beforeEach(() => {
    DocumentMeta.canUseDOM = true;
    removeDocumentMeta();
    TestUtils.renderIntoDocument(
      <div>
        <DocumentMeta {...DOC_META} />
        <div>
          <DocumentMeta {...DOC_META_NESTED} extend />
        </div>
      </div>
    );
  });
 
  it('should render document.title / <title> according to the title-attr', () => {
    assert.strictEqual( document.title, DOC_META_NESTED.title );
  });
 
  it('should render <meta name="description" content="..."> according to the description-attr', () => {
    assert.strictEqual( getAttr('meta[name=description]', 'content'), DOC_META_NESTED.description );
  });
 
  it('should render <link rel="canonical" href="..." according to the canonical-attr', () => {
    assert.strictEqual( getAttr('link[rel=canonical]', 'href'), DOC_META_NESTED.canonical );
  });
 
  it('should render simple meta tags, eg. <meta charset="...">', () => {
    assert.strictEqual( getAttr('meta[charset]', 'charset'), DOC_META.meta.charset );
  });
 
  it('should render normal meta tags, eg. <meta name="..." content="...">', () => {
    Object.keys( DOC_META.meta.name ).reduce(( name ) => {
      const value = DOC_META_NESTED.meta.name.hasOwnProperty(name)
        ? DOC_META_NESTED.meta.name[name]
        : DOC_META.meta.name[name];
      assert.strictEqual( getAttr(`meta[name=${ name }]`, 'content'), value, `<meta name="${ name }" ... /> has not been rendered correctly` );
    });
  });
 
  it('should render normal link tags, eg. <link rel="..." href="...">', () => {
    Object.keys( DOC_META.link.rel ).reduce(( rel ) => {
      const value = DOC_META_NESTED.link.rel.hasOwnProperty(rel)
        ? DOC_META_NESTED.link.rel[rel]
        : DOC_META.link.rel[rel];
      const values = Array.isArray(value) ? value : [ value ];
      const elements = getElements( `link[rel=${ rel }]` );
      elements.forEach(( element, idx ) => {
        assert.strictEqual( element.getAttribute('content'), values[idx], `<link rel="${ rel }" ... /> has not been rendered correctly` );
      });
    });
  });
});