在调试JSF复合组件的javascript部分时，Chrome（FF也是）的一些奇怪行为

Question

我正在使用以下代码制作JSF复合组件：

<cc:implementation componentType="timePickerComponent">

    <div id="#{cc.clientId}" style="#{cc.attrs.style}">

        <h:outputScript name="js/timepicker/timepicker_helper.js"/>

            <p:autoComplete id="timepicker"
                    scrollHeight="200"
                    onfocus="openAutocompletePanel(this);"
                    widgetVar="#{cc.attrs.widgetVar}"
                    completeMethod="#{cc.completeMethod}" 
                    value="#{cc.timeLocal}"  
                    size="5"/>


    </div>

</cc:implementation>

timepicker_helper.js只包含单一功能：

function openAutocompletePanel(field){
    console.log("ups");
    console.log(field);
}

当我尝试在Chrome开发者工具中调试openAutocompletePanel函数时，即在函数的开头或中间定义断点时，它不起作用。但是函数本身被调用，它会打印到控制台。

当我在debugger;的中间添加了行openAutocompletePanel时，它已在此时停止，但不是文件timepicker_helper.js Chrome已打开文件VM3339。

我的屏幕有快照：

这不是我第一次在Chrome中调试JSF的javascript，但我第一次遇到这个问题。什么可能导致这种行为？

谢谢。

更新：

好的，这是我的错。 BalusC 多次表示，当您在复合组件中包含 javascript 时，您应该指定target="head"，否则会多次加载。 当我将句子加载到<h:outputScript name="js/timepicker/timepicker_helper.js" target="head"/>时，问题就消失了。 我不能认为这是答案，因为我不确定100％是否正确。

Answer 1

很抱歉，无法发表评论，所以把它作为答案......

这种行为可能是由JavaScript eval();函数加载并执行timepicker_helper.js。

在这种情况下，开发人员控制台将显示包含原始文件的公共文件，如下所示：VM3339。 在这种情况下，debugger;是打破内部的唯一方法。