fix(single): stop the video cover letterboxing inside its ratio box

The player init wrote an inline object-fit:contain on the video
element, which outranked the injected stylesheet's object-fit:cover
fill contract and left black bars above/below whenever the cover box
ratio differed from the video. Drop the inline style so the
stylesheet rule is the single source of truth, and pin the
no-inline-style rule in the cover contract test.
This commit is contained in:
2026-09-06 11:00:04 +08:00
parent 6ffc5ba3d6
commit 7c0d5945ca
2 changed files with 7 additions and 1 deletions
+2 -1
View File
@@ -83,7 +83,8 @@
if (this.loop) this.video.loop = true;
if (this.muted) this.video.muted = true;
if (this.poster) this.video.poster = this.poster;
this.video.style.cssText = 'display:block;width:100%;height:100%;object-fit:contain;max-height:none;';
// 视频尺寸/裁切全部由注入样式表的 .aksrt-video video 规则决定,
// 禁止再加内联样式(内联 cover/contain 会覆盖契约导致信箱式黑边)。
// Play overlay
this.overlay = document.createElement('div');
@@ -99,6 +99,11 @@ test('video cover: the player video fills and center-crops like the image cover'
/max-height:70vh/,
'封面盒高度由比例盒决定,不得再套 70vh 截断'
);
assert.doesNotMatch(
player,
/video\.style\.cssText/,
'视频不得携带内联样式:内联 object-fit 会以更高优先级覆盖注入样式表的 cover 契约,产生信箱式黑边'
);
});
test('video cover: play never runs against a sourceless player', () => {