electron [Bug]:使用desktopCapturer共享Chrome窗口时,无法显示由html标签< select>和< option>提供下拉列表效果,

ep6jt1vc  于 7个月前  发布在  Electron
关注(0)|答案(4)|浏览(75)

预检清单

Electron 版本

29.4.3

您正在使用的操作系统是什么?

macOS

您正在使用的操作系统版本是什么?

macOS Ventura Version 13.1

您正在使用的架构是什么?

x64

最后已知正常工作的 Electron 版本

  • 无响应*

预期行为

我按照文档 here 共享一个窗口,该窗口是 Chrome 应用程序。Chrome 应用程序打开一个 website,其中包含一个下拉列表( 和 )。当我在 Chrome 应用程序中点击下拉列表时,下拉列表效果应该在我的应用中显示。

实际行为

当我在 Chrome 应用程序中点击下拉列表时,下拉列表效果并没有在我的应用中显示,但是当我选择一个选项时,最终选定的值会正确显示。
Image1 在 Chrome 中显示。
Image2 在共享屏幕的 Electron 中显示。

jv2fixgn

jv2fixgn1#

您需要分享更多信息,您的代码?没有这些我们无法重现问题。

g2ieeal7

g2ieeal72#

您需要分享更多信息,您的代码?没有这些我们无法重现问题。
我分享了测试用例gist:https://gist.github.com/e3e6faf584a9ef47685d875d298dd517。您可以直接使用“electron fiddle”来重现问题。
如果不方便的话,主代码看起来像这样(几乎从documentation复制而来):

# main.js

ipcMain.on("start-share-screen", (event) => {
    const webContents = event.sender;
    const win = BrowserWindow.fromWebContents(webContents);
    desktopCapturer
      .getSources({ types: ["window", "screen"] })
      .then(async (sources) => {
        console.log("sources: ", sources);
        win.webContents.send("SET_SOURCES", sources);
      });
  });

# preload.js

onSetSources: (callback) =>
    ipcRenderer.on("SET_SOURCES", (_event, sources) => {
      console.log("_event: ", _event, "; sources: ", sources);
      callback(sources);
    }),

# render.js

const stream = await navigator.mediaDevices.getUserMedia({
      audio: false,
      video: {
        mandatory: {
          chromeMediaSource: "desktop",
          chromeMediaSourceId: sourceId,
          minWidth: 1280,
          maxWidth: 1280,
          minHeight: 720,
          maxHeight: 720,
        },
      },
    });
    console.log("videoShareScreen: ", videoShareScreen);
    console.log("steam: ", stream);
    videoShareScreen.srcObject = stream;
    videoShareScreen.onloadedmetadata = (e) => videoShareScreen.play();

谢谢,期待您的回复。

0yycz8jy

0yycz8jy3#

我看到下拉菜单符合预期:

rwqw0loc

rwqw0loc4#

我看到下拉菜单符合预期:

感谢您的回复。我提到的问题不是指这里的下拉菜单。以您的截图为例,以下是重现问题的步骤:
步骤1:让我们选择“Google Chrome - window:111683:0”。注意:您需要选择源窗口类型,而不是屏幕类型。源窗口类型的屏幕类型没有问题。
步骤2:在选定的Google Chrome窗口中打开网页“ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select ”。
步骤3:点击打开的网页上的下拉菜单,如图3所示。
步骤4:观察Electron中的共享屏幕页面。

相关问题