Topic on Extension talk:Bootstrap

Bootstrap CSS directives won't apply

17
178.0.131.87 (talkcontribs)

At first, I want to thank you for your extension! It really spares me a lot of time not having to figure out how to get Bootstrap running with MediaWiki. Unfortunately, it's not working out-of-the-box for me. I've followed the installation instructions and your extension shows up on the Special:Version page, but the Bootstrap CSS directives fail to spawn.

I'm writing an extension that uses its own content model. In fillParserOutput, where I add all my resource loader modules, I retrieve the singleton and add all Bootstrap modules via addAllBootstrapModules. However, the Bootstrap CSS directives do still not seem to apply. Is there anything I am missing or do I need to add the Bootstrap modules at another point in time?

It may be worth noting that I can not see any Bootstrap CSS/LESS files in the directory of your extension - in case they are downloaded to this one, at all.

This post was hidden by F.trott (history)
F.trott (talkcontribs)

After addAllBootstrapModules you need to add the module 'ext.bootstrap' to the OutputPage.

Sebschlicht (talkcontribs)

(I've started this topic) Yeah, I'm doing exactly what the installation and the usage sections of the extension told me to. Today I've noticed that the extension actually is working if I'm in debug mode (appending 'debug=1' to the URL parameters). Is this a caching issue or what kind of sorcery is preventing the extension to work in normal mode?

F.trott (talkcontribs)

It could indeed be a caching issue. If the page is retrieved from the cache, it may be that the hook you are using is never called. If that is the case it might be better to work with the ParserOutput object instead of the OutputPage.

Sebschlicht (talkcontribs)

Wouldn't this mean that everything should work fine on new pages that could impossibly be cached before? The extension doesn't show on new pages as well...until switching to debug mode!

F.trott (talkcontribs)

Not necessarily. A page consists of several calls, each of which is cached separately. So if your new page uses the same styles as other pages these styles may come from the cache. Although I admit that it is sometimes not so easy to find out what is cached and what is not.

Sebschlicht (talkcontribs)

I've tried to add the Bootstrap module using the ParserOutput in the OutputPageParserOutput hook. Same results here.

Sebschlicht (talkcontribs)

Let's step back. What is the absolute minimum to get the extension running? (1) get BootstrapManager singleton and (2) add which modules are needed, e.g. all via addAllBootstrapModules. Then (3) add the Bootstrap modules, e.g. ext.bootstrap.style, via ParserOutput/OutputPage->addModuleStyles and (4) add the modules of my own extension in the same way. Are these all steps necessary and is the ordering correct?

F.trott (talkcontribs)

I think that should be it.

Sebschlicht (talkcontribs)

Okay, now I'm pretty sure that is not an issue with your extension: If I register module styles within the OutputPageParserOutput hook, both your extension's and my own extension's styles are applied in debug mode only. I have no idea what's going on here... Do you know which cache could cause this issue and/or how to clear it or all caches involved?

F.trott (talkcontribs)

Not sure. There is $wgParserCache, but I don't know if it is used by the Resource loader. It might also be worth seeing if the call to retrieve the styles is contained in the HTML of the page and if it returns valid styles.

Sebschlicht (talkcontribs)

The call to retrieve the styles is triggered in both normal and debug mode. However, in normal mode its response doesn't contain the Bootstrap style directives.

F.trott (talkcontribs)

Ok, I tried it and it turns out that the instructions are somewhat inaccurate. In fact, they are totally borked. :)

Here is what you need to add to LocalSettings.php to enable Bootstrap styles on all pages:

$wgHooks['SetupAfterCache'][]=function(){
	\Bootstrap\BootstrapManager::getInstance()->addAllBootstrapModules();
	return true;
};

$wgHooks['ParserAfterParse'][]=function( Parser &$parser, &$text, StripState &$stripState ){
	$parser->getOutput()->addModuleStyles( 'ext.bootstrap.styles' );
	$parser->getOutput()->addModuleScripts( 'ext.bootstrap.scripts' );
	return true;
};
92.73.1.231 (talkcontribs)

Thanks for looking into this issue, I really appreciate it! However, this doesn't work for me neither :D Again, in debug mode it works. In production mode it doesn't.

I've looked into this issue in more detail and here's what happens: In production mode, all modules are loaded in one or two requests. The request asks for your extension's module but its response doesn't contain any Bootstrap directives.

In debug mode, all modules are loaded in single requests. The request retrieving my extension's module returns the most recent version of my files. The request retrieving your extension's module returns a stylesheet containing the Bootstrap directives AND an old version of my own extension's stylesheet.

I remember to use addExternalModule like in the Chameleon skin and I guess the resource loader at some point decided to cache the response - including my module. However, this is really frustrating because in the resulting sheet these old directives are below my most recent ones and thus override all of them that don't have a higher cascade weight.

In production mode the response might have also be cached at a point in time when I didn't get your extension to fully work yet. However, I have no idea how to cope with this issue. Restarting the vagrant VM doesn't change anything. I've disabled caching wherever I could and cleared the central cache folder without success. Database tables like *cache are empty. And so is my browser cache.

I have no idea where it's being cached. Maybe on HTTP server level.

Sebschlicht (talkcontribs)

Okay, I have to revise my statement: Adding the hooks to the LocalSettings.php actually DOES work for both modes! However, this is not what I need because I want to use Bootstrap within my extension, I don't want to force the whole installation to use it :/

F.trott (talkcontribs)

Well then for ParserAfterParse you have to make sure it is only applied in case you need it. The SetupAfterCache hook does not hurt. It just registers the module without actually delivering it to the client.

Reply to "Bootstrap CSS directives won't apply"