是否可以从Chrome扩展程序的内容脚本访问在主窗口中创建的聚合物元素的属性?



我需要创建一个镀铬扩展名,该扩展可以自动与用聚合物编写的Web应用程序进行一些交互。

我有这个生成的html:

<paper-input id="value-input" label="Value" no-label-float="" tabindex="0" aria-disabled="false">
    <paper-input-container class="style-scope paper-input">
        <template is="dom-if" class="style-scope paper-input-container"></template>
        <div class="input-content style-scope paper-input-container">
            <div class="label-and-input-container style-scope paper-input-container" id="labelAndInputContainer">
                <label aria-hidden="true" slot="label" class="style-scope paper-input" for="input-2"
                       id="paper-input-label-2">Value</label>
                <input is="iron-input" slot="input" class="input-element style-scope paper-input" autocomplete="off"
                       placeholder="" autocapitalize="none" autocorrect="off" aria-describedby=""
                       aria-labelledby="paper-input-label-2" tabindex="0" id="input-2">
            </div>
        </div>
        <div class="underline style-scope paper-input-container">
            <div class="unfocused-line style-scope paper-input-container"></div>
            <div class="focused-line style-scope paper-input-container"></div>
        </div>
        <div class="add-on-content style-scope paper-input-container"></div>
    </paper-input-container>
</paper-input>

此输入是较大(聚合物(形式的一部分,仅在输入中写入某些内容时,提交按钮才能启用。

不幸的是,天真地做document.querySelector('#input-2').value = 'something'不会起作用。

该按钮仍然禁用。为了使按钮启用,我需要利用聚合物提供的API到升级的元素。

因此,document.querySelector('paper-input').updateValueAndPreserveCaret('something')(使用聚合物元素的updateValueAndPreserveCaret方法(将起作用。该按钮将被通知并启用。

问题

从我的扩展程序的内容脚本内部,我似乎无法访问聚合物将其应用于自定义组件的任何属性/方法。

例如,如果我尝试从内容脚本内部使用document.querySelector('paper-input').updateValueAndPreserveCaret('something'),我会发现updateValueAndPreserveCaret不确定的错误。

这不仅适用于聚合物提供的方法,还适用于属性(例如document.querySelector('paper-input').$也是未定义的(

这是我无法访问属性和功能的情况,因为它们是在其他window上下文中创建的?

我建议this.shadowroot.queryselector('纸输入'(可以在聚合物3.0中使用。目前,许多使用this.shadowroot.queryslector(''(的聚合物程序员。

最新更新