Custom styles randomically neglected

[bunglegrind]

Ok, another one:

page (not only this one...):
https://developer.wordpress.org/plugins/plugin-basics/determining-plugin-and-content-directories/

custom style:

#wpadminbar {
    display:none;
}
#wporg-header {
    display:none;
}
header {
    display:none;
}
#secondary {
    display:none;
}
#wporg-footer {
    display:none;
}
.breadcrumbs {
    display:none;
}
.nav-links {
    display:none;
}
.table-of-contents {
    display:none;
}
.toc-jump {
    display:none;
}
#content {
    max-width:100%!important;
}
.screen-reader-text {
    display:none;
}

In the epub at random I see some of the html classes/ids that I set to display:none (#wporg-header, #wporg-footer).

I've observed that in the HTML code of the preview shown by the browser (with alt+shift+1 for instance) the classes can be hidden or absent at all, in the former case the epub will show the aforementioned issue, in the latter the epub will be correctly displayed.

I've experienced this issue both with the latest release and with the master branch.

[bunglegrind]

Hi Adam, there is something in your code that I really don't get...possibly related to this issue.

In file extractHtml.js, it looks like lines 329-335 (which are related to the custom styles) are never executed...

[bunglegrind]

It looks like Chrome is not affected...only Firefox

[alexadam]

hmm... that's the 'else' of the "Include (Custom) Style" check on the menu. it's a mess, I'll take a look on it

[bunglegrind]

I see, I've tried to follow your code execution...and I think I found the bug.

I guess the problem is when you inject the custom css style in the page (chrome.tabs.insertCSS line 273 in background.js), you should wait until the operation is completed (in fact, the method accepts a callback, both in Firefox and Chrome, despite what is written in Firefox docs).

At the moment, you're not waiting - and probably this causes the issue in Firefox.

Anyway, I kindly suggest you to refactor your code in a more functional style, using map, filter, reduce to get rid of the for cycles, possibly resorting to a linter in order to mantain a strict adherence to a particular coding style and employing an asynchronous library, such as parseq (https://github.com/douglascrockford/parseq) or similar to remove all the callbacks. And you should remove the function parameters that are unused.

oh, and put the libraries you're using (jquery, etc.) in a lib folder or similar.

[alexadam]

I fixed it, thanks for the help!

[bunglegrind]

Very good!