2016-09-07 5 views
0
에 스크립트 파일을로드하지 않음

결국 그래프를 생성 할 jsdom에서 html 페이지를로드하는 테스트를 시도하고 있습니다. html 페이지를로드하고 javascript를 실행하는 첫 번째 장애물을 극복 할 수 없습니다.JSDOM이 노드

다음은로드하려고하는 HTML 페이지입니다. 매개 변수를 가져 오지 않고 간단한 그래프 만 렌더링합니다. 여기

<html> 
<head> 
    <script src="http://code.jquery.com/jquery.min.js"/> 
    <script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"/> 
    <script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js"/> 
    <script src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"/> 
    <script> 
     var testVar = true; 
     function test(){ 
      testVar = false; 
     }; 
    </script> 
    <script> 
     $(document).ready(function(){ 
      FusionCharts.ready(function() { 
      var revenueChart = new FusionCharts({ 
       type: 'column2d', 
       renderAt: 'container', 
       width: '400', 
       height: '200', 
       dataFormat: 'json', 
       dataSource: { 
        "chart": { 
         "caption": "Split of Revenue by Product Categories", 
         "subCaption": "2014", 
         "numberPrefix": "$", 
         "theme": "fint", 
         "captionFontSize": "13", 
         "subcaptionFontSize": "12", 
         "subcaptionFontBold": "0", 
         "showValues": "0" 
        }, 
        "data": [{ 
         "label": "Food", 
          "value": "28504" 
        }, { 
         "label": "Apparels", 
          "value": "14633" 
        }, { 
         "label": "Electronics", 
          "value": "10507" 
        }, { 
         "label": "Household", 
          "value": "4910" 
        }] 
       } 
      }).render(); 
      }); 

      var svg = $('#container').html(); 
     }); 
    </script> 
<head> 
<body> 
    <div id="container">Charts will render here</div> 
</body> 

var config = { 
    file: path.join(__dirname, "chart.html"), 
    features:{ 
     FetchExternalResources: ["script"], 
     ProcessExternalResources: ["script"], 
     MutationEvents: '2.0' 
    }, 
    scripts:[ 
     "http://code.jquery.com/jquery.min.js", 
     "http://static.fusioncharts.com/code/latest/fusioncharts.js", 
     'http://static.fusioncharts.com/code/latest/fusioncharts.charts.js', 
     "http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js" 
    ],   
    onload: function(err, window) { 
     console.log('*******onload') 
    }, 
    created: function(err, window) { 
     console.log('*******created') 
    },   
    done: function(err, window) { 
     console.log('*******done') 
     if(err){ 
     console.log('*****got err ' + err.message); 
     callback(err); 
     } 

     global.window = window; 
     console.log('inside done ----------') 
     var $ = window.jQuery || window.$, 
     FusionCharts = window.FusionCharts, 
     document = window.document; 

     if(typeof FusionCharts == 'undefined') 
     console.log('FusionCharts NOT LOADED') 
     else 
     console.log('FusionCharts LOADED') 

     if(typeof $ == 'undefined') 
     console.log('JQUERY NOT LOADED') 
     else 
     console.log('JQUERY LOADED') 

     console.log('testVar ' + window.testVar) 
     console.log(window.test()) 
     console.log('testVar ' + window.testVar) 
     console.log('svg is ' + window.svg); 
     console.log($('#container').html()); 

     window.close();   

    } 
    } 
    jsdom.env(config); 

여기서 이상한 것은 내가 설정 개체에 scripts을 포함하지 않는 경우이다 .. 나는이 페이지를로드하려고 노드의 코드입니다 그것들을로드하지 않고 html 페이지에 있다고 생각하더라도 done 콜백에서 사용할 수있게합니다.

또한 testVar은 콜백에 정의되어 있지 않습니다. 심지어 페이지에 있다고 생각하더라도 (window.test()과 동일 함), HTML 페이지에서는 콜백에서 사용할 수없는 것처럼 보입니다.

jsdom 개체를 만드는 데있어 다른 모든 변형을 시도했지만 그 중 아무 것도 페이지를 설정 개체로 전달하지 않고 스크립트를로드 할 수 없으며 다른 버전에서 변수 및 함수에 액세스 할 수 없습니다 스크립트 태그에 정의되어 있습니다.

누락 된 것이 있습니까? 그들이 올바른 HTML을되도록

답변

2
script 요소를 변경

:

<script src="http://code.jquery.com/jquery.min.js"></script> 

당신이 모든 것을 잘로드 및 구성에 scripts를 사용할 필요가 없습니다 그렇게한다면

.

+0

루이, 바로 그거야. 이제 2 가지 더 질문이 있습니다. 먼저 함수 $ (document) .ready가 호출되지 않습니다. 어떻게 호출되는지를 확인하거나 테스트 할 수 있습니다. 둘째, 필자는 노드에서 코드를 다시 전달할 수 있습니다. 필자가 이벤트를 창에 붙이려고했는데 html에서이를 전파했지만 작동하지 않는 것처럼 보였습니다. 마지막으로, 어떻게 창 내부에서 로그하고 내 노드 백엔드에서 로그를 캡처 할 수 있습니까? jsdom.env 메소드를 사용할 때 jsdom 사이트의 예제는 아무 것도 표시하지 않습니다. – John