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:
@@ -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', () => {
|
||||
|
||||
Reference in New Issue
Block a user