预检清单
- 我已阅读了此项目的 Contributing Guidelines。
- 我同意遵循此项目遵循的 Code of Conduct。
- 在不成功的情况下，我已搜索了 issue tracker 以查找与我想要提交的 bug 报告相匹配的 bug 报告。
Electron 版本
22.3.21 AND 27.0.4 AND 28.2.3[2023-11-9] Update: this issue probably also exists in Electrion 23 / 24 / 25 / 26[2024-2-20] Update: this issue probably also exists in Electrion 23 / 24 / 25 / 26 / 27
此问题在最新 Edge(119.0.2151.44)中不存在
您使用的操作系统是什么？
Windows
您使用的操作系统版本
Windows 10 22H2 19045.3324
您使用的架构是什么？
x64
最后已知的工作 Electron 版本
- 无响应*
预期行为
我正在使用一个 17" 2560x1600 屏幕测试此问题。
根据之前的测试，此问题与以下内容密切相关：
- SVG viewBox 设置
- Windows 的缩放因子(150%)
要重现此问题，请使用以下文件创建一个新的 electron 22.3.21 应用程序(index.html):
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline'" />
<title>SVG Test</title>
</head>
<body style="margin: 0">
<div>
<svg id="graph" style="height: 100vh; width: 100%;">
<rect x="177" y="60" width="140" height="30" data-col="1" data-row="1"></rect>
</svg>
</div>
<script>
function Component () {
this.svg = document.querySelector('svg')
this.width = this.svg.getBoundingClientRect().width;
this.height = this.svg.getBoundingClientRect().height;
this.x = 90
this.y = 20
this.updateViewbox = () => {
this.svg.setAttribute('viewBox', `${this.x} ${this.y} ${this.width} ${this.height}`)
}
this.updateViewbox()
this.setItemCursor = (cursor) => {
const element = document.querySelector(`rect`)
if (cursor == null) {
element.removeAttribute('style')
}
else {
element.setAttribute('style', 'cursor: ' + cursor)
}
}
window.addEventListener('resize', (event) => {
this.width = this.svg.getBoundingClientRect().width;
this.height = this.svg.getBoundingClientRect().height;
this.updateViewbox()
})
document.querySelector('rect').addEventListener('mousedown', (event) => {
if (event.button == 0) {
this.setItemCursor('grabbing')
}
})
document.querySelector('rect').addEventListener('mouseup', (event) => {
if (event.button == 0) {
this.setItemCursor(null)
}
})
}
const c = new Component()
</script>
</body>
</html>并使用以下文件作为 main.js(没有什么特别的):
const { app, BrowserWindow } = require('electron')
const path = require('path')
app.disableHardwareAcceleration()
var win = null
const createWindow = () => {
win = new BrowserWindow({
width: 1600,
height: 600,
})
win.webContents.openDevTools()
win.loadFile('index.html')
}
app.whenReady().then(() => {
createWindow()
app.on('activate', () => {
if (BrowserWindow.getAllWindows().length === 0) {
createWindow()
}
})
})
app.on('window-all-closed', () => {
if (process.platform !== 'darwin') {
app.quit()
}
})窗口中有一个黑色矩形。当用户单击矩形的任何部分时，光标应更改为“抓住”。无需移动。当左键释放时，光标应恢复为默认状态。
实际行为
当用户单击矩形的下部时，它按预期工作。
- 当用户在矩形的上部执行 mousedown 时，光标不会更改
- 当用户然后在矩形的上部执行 mouseup 时，光标会更改为“抓住”
- 当用户然后执行 mousemove 时，光标会更改为默认状态
8条答案
按热度按时间ttvkxqim1#
@windy32,这种情况在Chrome本身中发生吗？
b1uwtaje2#
这个问题在Electron 27.0.4(最新稳定版本)中也存在。
这个问题在Edge 119.0.2151.44(最新稳定版本)中不存在。
应该有一个通用的修复方法来解决这个问题。当这个问题在主线上修复时，我希望将其移植到Electron 22。然而，Electron 22已经到达了EOL(结束支持)。如果不可能的话，我可能需要维护一个个人Electron 22分支。
omqzjyyz3#
这个问题已经被自动标记为过时。如果这个问题仍然影响到你，请留下任何评论(例如“提升”),我们会保持开放。如果你有任何新的附加信息——特别是，如果这个问题在 latest version of Electron 或 beta 中仍然可复现——请在你的评论中包含它！
eulz3vhy4#
这个问题已经被自动标记为过时。如果这个问题仍然影响到你，请留下任何评论(例如“提升”),我们会保持开放。如果你有任何新的附加信息——特别是，如果这个问题在最新的latest version of Electron版本或beta版本中仍然可重现——请在你的评论中包含它！
问题仍然存在于最新版本的Electron中
5f0d552i5#
这个问题在Edge 119.0.2151.44(最新稳定版本)中不存在。
Edge与Google Chrome存在非平凡的差异。请在Chrome本身中进行检查。
dohp0rv56#
这个问题在Edge 119.0.2151.44(最新稳定版本)中不存在。
Edge与Google Chrome存在非平凡的差异。请在Chrome本身中检查。
这个问题也在Electron 28.2.3(最新稳定版本)中存在。
这个问题在Google Chrome 121.0.6167.185(最新稳定版本)中不存在。
owfi6suc7#
这个问题已经被自动标记为过时。如果这个问题仍然影响到你，请留下任何评论(例如“提升”),我们会保持开放。如果你有任何新的附加信息——特别是，如果这个问题在 latest version of Electron 或 beta 中仍然可复现——请在你的评论中包含它！
kr98yfug8#
这个问题已经被自动标记为过时。如果这个问题仍然影响到你，请留下任何评论(例如“提升”),我们会保持开放。如果你有任何新的附加信息——特别是，如果这个问题在最新的latest version of Electron版本或beta版本中仍然可重现——请在你的评论中包含它！
问题仍然存在于最新版本的Electron中