TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-11-24 06:35:49 +03:00
Code Issues Projects Releases Wiki Activity

Fixed duplicate images in Outlook for dark/light mode

Browse Source 
refs https://github.com/TryGhost/Team/issues/2671

The inline style display: none; isn't applied to the images in Outlook for some reason. This change manually removes the images in the backend.
This commit is contained in:
Simon Backx 2023-04-05 12:51:18 +02:00
parent aaf2ee96c0
commit ca00a3d682
2 changed files with 58 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
ghost/email-service/lib/email-renderer.js
View File

@ -346,6 +346,17 @@ class EmailRenderer {
}
});
// Remove duplicate black/white images (CSS based solution not working in Outlook)
if (templateData.backgroundIsDark) {
$('img.is-light-background').each((i, elem) => {
$(elem).remove();
});
} else {
$('img.is-dark-background').each((i, elem) => {
$(elem).remove();
});
}
// Convert DOM back to HTML
html = $.html(); // () Fix for vscode syntax highlighter

48
ghost/email-service/test/email-renderer.test.js
View File

@ -855,7 +855,7 @@ describe('Email renderer', function () {
});
describe('renderBody', function () {
let renderedPost = '<p>Lexical Test</p>';
let renderedPost = '<p>Lexical Test</p><img class="is-light-background" src="test-dark" /><img class="is-dark-background" src="test-light" />';
let postUrl = 'http://example.com';
let customSettings = {};
let emailRenderer;
@ -1195,6 +1195,52 @@ describe('Email renderer', function () {
response.plaintext.should.containEql('Test footer');
});
it('works in dark mode', async function () {
const post = createModel(basePost);
const newsletter = createModel({
header_image: null,
name: 'Test Newsletter',
show_badge: false,
feedback_enabled: true,
show_post_title_section: true,
background_color: '#000000'
});
const segment = null;
const options = {};
let response = await emailRenderer.renderBody(
post,
newsletter,
segment,
options
);
assert.doesNotMatch(response.html, /is-light-background/);
});
it('works in light mode', async function () {
const post = createModel(basePost);
const newsletter = createModel({
header_image: null,
name: 'Test Newsletter',
show_badge: false,
feedback_enabled: true,
show_post_title_section: true,
background_color: '#FFFFFF'
});
const segment = null;
const options = {};
let response = await emailRenderer.renderBody(
post,
newsletter,
segment,
options
);
assert.doesNotMatch(response.html, /is-dark-background/);
});
it('replaces all links except the unsubscribe and feedback links', async function () {
const post = createModel(basePost);
const newsletter = createModel({