[support] page-init JS (setting window.location.hash) behaves differently if JS-aggregation is ON vs OFF. is it load-order, or something else?
drupsupp at eml.cc
drupsupp at eml.cc
Thu Jul 12 20:37:48 UTC 2012
my site's frontpage has a CSS3-only object (fwiw, an accordion).
i've added a page .js init that contains
(function($) {
Drupal.behaviors.frontpage = {
attach: function(context,settings) {
--> window.location.hash = '#pane1';
which, on document.ready 'jumps to' the accordion "pane1" anchor tag,
opening it as default.
that init is loaded in a preprocess-page hook,
---------------------------------------
<?php
function sub_omega_alpha_preprocess_page(&$vars) {
...
drupal_add_js(
$pgn_theme_dir . '/js/all-p-init.js',
array(
'type' => 'file',
'scope' => 'header',
'group' => JS_LIBRARY,
'every_page' => FALSE,
'weight' => -99,
'defer' => FALSE,
'cache' => TRUE,
'preprocess' => TRUE,
)
);
if (drupal_is_front_page()) {
...
drupal_add_js(
$pgn_theme_dir . '/js/fp-init.js',
array(
'type' => 'file',
'scope' => 'header',
'group' => JS_LIBRARY,
'every_page' => FALSE,
'weight' => -99,
'defer' => FALSE,
'cache' => TRUE,
'preprocess' => TRUE,
)
);
} else {
drupal_add_js(
$pgn_theme_dir . '/js/not-fp-init.js',
array(
'type' => 'file',
'scope' => 'header',
'group' => JS_LIBRARY,
'every_page' => FALSE,
'weight' => -99,
'defer' => FALSE,
'cache' => TRUE,
'preprocess' => TRUE,
)
);
}
;}
---------------------------------------
this works as expected if at
.../admin/config/development/performance
JavaScript agg is enabled,
--------------------------------------
Bandwidth optimization
External resources can be optimized automatically, which
can reduce both the size and number of requests made to
your website.
[ ] Compress cached pages.
[ ] Aggregate and compress CSS files.
[X] Aggregate JavaScript files.
--------------------------------------
The browser URL bar correctly displays the anticipated
https://test.net/#pane1
If I simply toggle that setting OFF,
- [X] Aggregate JavaScript files.
+ [ ] Aggregate JavaScript files.
then everything works as always -- EXCEPT the accordion object is
rendered initially in an all-closed state. I.e., that 'jump to' the
anchor is not in-effect.
In this case, the browser URL bar in-correctly displays
https://test.net/
i.e., NO anchor tag.
Since Omega, LabJS & Drupal core all could ostensibly play a part, I'm
not sure what the singular cause of this difference in behavior might
be. My gut tells me it's likely .js load-order being handled
differently in the two cases. I'm not yet convinced ...
Here's a diff of the page's ViewSource for the two cases -- js
aggregation ON, and js aggregation off:
--- js-agg-OFF.txt 2012-07-12 12:14:43.931189584 -0700
+++ js-agg-ON.txt 2012-07-12 12:15:30.382410736 -0700
@@ -76,30 +76,11 @@
</script>
<script>
// LABjs exclusion
-$L =
$L.script(["https://test.net/sites/all/modules/contrib/jquery_update/replace/jquery/1.7/jquery.min.js",
-"https://test.net/misc/jquery.once.js",
-"https://test.net/sites/all/modules/contrib/labjs/replace/drupal.js",
-"/data/webapps/cdn/www.pgnetwork.net/js/dialogextend/jquery.dialogextend.pack.js",
-"https://test.net/sites/all/themes/sub_omega/js/all-p-init.js",
==> -"https://test.net/sites/all/themes/sub_omega/js/fp-init.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/ui/minified/jquery.ui.core.min.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/ui/minified/jquery.ui.widget.min.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/external/jquery.cookie.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/ui/minified/jquery.ui.button.min.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/ui/minified/jquery.ui.mouse.min.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/ui/minified/jquery.ui.draggable.min.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/ui/minified/jquery.ui.position.min.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/ui/minified/jquery.ui.resizable.min.js",
-"https://test.net/sites/all/modules/contrib/jquery_update/replace/ui/ui/minified/jquery.ui.dialog.min.js",
-"https://test.net/sites/all/modules/contrib/views/js/jquery.ui.dialog.patch.js",
-"https://test.net/sites/all/modules/contrib/admin_menu/admin_devel/admin_devel.js",
-"https://test.net/sites/all/modules/contrib/contentanalysis/contentanalysis.js",
-"https://test.net/sites/all/modules/contrib/contentoptimizer/contentoptimizer.js",
-"https://test.net/sites/all/modules/contrib/resp_img/resp_img.js",
-"https://test.net/sites/all/modules/contrib/panels/js/panels.js",
-"https://test.net/sites/all/modules/contrib/google_analytics/googleanalytics.js",
-"https://test.net/sites/all/themes/contrib/omega/omega/js/jquery.formalize.js",
-"https://test.net/sites/all/themes/contrib/omega/omega/js/omega-mediaqueries.js"]);
+$L =
$L.script(["https://test.net/sites/default/files/js/js_LP6eaYL3pE-X3CISx4yhE59L-xvxjYoQEJLVKAKrEjo.js",
==>
+"https://test.net/sites/default/files/js/js_r9tk7PwLQm4lcqNXt_DTdEfATxWT8fTavO9qp3cJB3E.js",
+"https://test.net/sites/default/files/js/js_4ZrSfhQVOw6i9znJCZe7jUN7u2jzAKWco-Dev1ujF6I.js",
+"https://test.net/sites/default/files/js/js_EtFFZ9lbcSXbmEJ6DdbkcmBheDx1eo7ktRZ23bOLLFs.js",
+"https://test.net/sites/default/files/js/js_SqSPKHRdgR49lUgM5xyDHyrUmB1wUEtOwPIRN_Hqmew.js"]);
</script>
<script>
$L = $L.wait(function() {
@@ -108,7 +89,7 @@
</script>
<script>
$L = $L.wait(function() {
-jQuery.extend(Drupal.settings,
{"basePath":"\/","pathPrefix":"","ajaxPageState":...width:
1220px)"}}}});
+jQuery.extend(Drupal.settings,
{"basePath":"\/","pathPrefix":"","ajaxPageState":...width:
1220px)"}}}});
});
</script>
<!--[if lt IE 9]><script
src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
where inside
sites/default/files/js/js_r9tk7PwLQm4lcqNXt_DTdEfATxWT8fTavO9qp3cJB3E.js
I find the relevant JS
...
(function($) {
Drupal.behaviors.frontpage = {
attach: function(context,settings) {
// 'jump to' the accordion pane#, opening it as default
window.location.hash = '#pane1';
...
i understand this is a rather nitpicky/arcane issue.
Presuming that load-order is the issue, I'm working, somewhat randomly
atm, at finding a load-order in the unaggregated case that functions
correctly.
Any informed guidance as to what may specifically be the cause of this
'jump to tag' sensitivity to js aggregation state would be appreciated.
More information about the support
mailing list