import mocha from 'mocha' ; import chai from 'chai' ; import { getNode } from './node' ; const expect = chai . expect ; const svgAttributes = { } ; param placeholderElement param svg function copyData ( placeholderElement , svg ) { const svgStyle = svg . style ; const placeholderAttributes = placeholderElement . attributes ; for ( let i = 0 ; i < placeholderAttributes . length ; i ++ ) { const item = placeholderAttributes . item ( i ) ; if ( item ) { const name = item . name ; if ( name !== 'class' && name !== 'style' && svgAttributes [ name ] === void 0 ) { try { svg . setAttribute ( name , item . value ) ; } catch ( err ) { } } } } const placeholderStyle = placeholderElement . style ; for ( let i = 0 ; i < placeholderStyle . length ; i ++ ) { const attr = placeholderStyle [ i ] ; const value = placeholderStyle [ attr ] ; if ( value !== '' ) { svgStyle [ attr ] = value ; } } } describe ( 'Testing copying node data' , ( ) => { it ( 'Inline attributes' , ( ) => { const node = getNode ( 'node-attributes' ) ; node . innerHTML = '<p title="Testing" data-foo="bar">Test</p>' ; const source = node . querySelector ( 'p' ) ; const target = document . createElement ( 'span' ) ; copyData ( source , target ) ; expect ( source . getAttribute ( 'title' ) ) . to . be . equal ( 'Testing' , 'Source title should be set' ) ; expect ( target . getAttribute ( 'title' ) ) . to . be . equal ( 'Testing' , 'Target title should be set' ) ; expect ( source . getAttribute ( 'data-foo' ) ) . to . be . equal ( 'bar' , 'Source data-foo should be set' ) ; expect ( target . getAttribute ( 'data-foo' ) ) . to . be . equal ( 'bar' , 'Target data-foo should be set' ) ; } ) ; it ( 'Inline style' , ( ) => { const node = getNode ( 'node-attributes' ) ; node . innerHTML = '<p style="color: red; border: 1px solid green; vertical-align: -.1em">Test</p>' ; const source = node . querySelector ( 'p' ) ; const target = document . createElement ( 'span' ) ; copyData ( source , target ) ; expect ( source . style . color ) . to . be . equal ( 'red' , 'Source color should be red' ) ; expect ( target . style . color ) . to . be . equal ( 'red' , 'Target color should be red' ) ; expect ( source . style . borderWidth ) . to . be . equal ( '1px' , 'Source border width should be 1px' ) ; expect ( target . style . borderWidth ) . to . be . equal ( '1px' , 'Target border width should be 1px' ) ; expect ( source . style . backgroundColor ) . to . be . equal ( '' , 'Source background color should not be set' ) ; expect ( target . style . backgroundColor ) . to . be . equal ( '' , 'Target background color should not be set' ) ; } ) ; it ( 'DOM style' , ( ) => { const node = getNode ( 'node-attributes' ) ; node . innerHTML = '<p>Test</p>' ; const source = node . querySelector ( 'p' ) ; source . style . color = 'green' ; source . style . border = '2px solid blue' ; const target = document . createElement ( 'span' ) ; copyData ( source , target ) ; expect ( source . style . color ) . to . be . equal ( 'green' , 'Source color should be green' ) ; expect ( target . style . color ) . to . be . equal ( 'green' , 'Target color should be green' ) ; expect ( source . style . borderWidth ) . to . be . equal ( '2px' , 'Source border width should be 2px' ) ; expect ( target . style . borderWidth ) . to . be . equal ( '2px' , 'Target border width should be 2px' ) ; expect ( source . style . backgroundColor ) . to . be . equal ( '' , 'Source background color should not be set' ) ; expect ( target . style . backgroundColor ) . to . be . equal ( '' , 'Target background color should not be set' ) ; } ) ; it ( 'Overwriting source style before copy' , ( ) => { const node = getNode ( 'node-attributes' ) ; node . innerHTML = '<p style="color: blue">Test</p>' ; const source = node . querySelector ( 'p' ) ; source . style . color = 'purple' ; const target = document . createElement ( 'span' ) ; copyData ( source , target ) ; expect ( source . style . color ) . to . be . equal ( 'purple' , 'Source color should be purple' ) ; expect ( target . style . color ) . to . be . equal ( 'purple' , 'Target color should be purple' ) ; } ) ; it ( 'Overwriting target style during copy' , ( ) => { const node = getNode ( 'node-attributes' ) ; node . innerHTML = '<p style="color: blue">Test</p>' ; const source = node . querySelector ( 'p' ) ; const target = document . createElement ( 'span' ) ; target . style . color = 'purple' ; target . style . verticalAlign = '-0.2em' ; copyData ( source , target ) ; expect ( source . style . color ) . to . be . equal ( 'blue' , 'Source color should be blue' ) ; expect ( target . style . color ) . to . be . equal ( 'blue' , 'Target color should be blue' ) ; expect ( source . style . verticalAlign ) . to . be . equal ( '' , 'Source vartical-align should not be set' ) ; expect ( target . style . verticalAlign ) . to . be . equal ( '-0.2em' , 'Target vertical-align should be set' ) ; } ) ; } ) ;