Updating translations... Footer out of place.

[iseulde]

See screenshot.

[michalzuber]

Reproduced with downloading every language from ​http://api.wordpress.org/translations/core/1.0/?version=4.0
It's enough to have more than YOUR_SCREEN_HEIGHT divided with 55px

1. Tried fixing with position: fixed, but it stick there as it should.
2. Next try was

   Index: src/wp-admin/css/common.css
   ===================================================================
   --- src/wp-admin/css/common.css	(revision 29275)
   +++ src/wp-admin/css/common.css	(working copy)
   @@ -11,8 +11,7 @@
    	height: 100%;
    }
    
   -#wpcontent,
   -#wpfooter {
   +#wpcontent {
    	margin-left: 180px;
    }
    
   @@ -1761,13 +1760,10 @@
    ------------------------------------------------------------------------------*/
    
    #wpfooter {
   -	position: absolute;
   -	bottom: 0;
   -	left: 0;
   -	right: 0;
   -	padding: 10px 0;
   -	margin-right: 20px;
   +	border-left: 160px solid #222;
    	color: #777;
   +	margin: 0 20px 0 0;
   +	padding: 10px 0 10px 20px;
    }
   
   

But it doesn't work with small height ​http://i.imgur.com/jIbCNTf.png

[ocean90]

Looking at the source code and there seems to be one closing div too much:

 txtlineno marks=19 
<div class="wrap">
	<h2>Update Translations</h2>
	<div class="update-messages lp-show-latest">
		<h4>Updating translations for Twenty Twelve (cs_CZ)&#8230;</h4>
		<p>Downloading translation from <span class="code">https://global.wordpress.org/builds/themes/twentytwelve/1.2/cs_CZ.zip</span>&#8230;</p>
		<p>Unpacking the update&#8230;</p>
		<p>Installing the latest version&#8230;</p>
		<p>Translation updated successfully.</p>
	</div>
	<script type="text/javascript">
		(function( wp ) {
			if ( wp && wp.updates.decrementCount ) {
				wp.updates.decrementCount( "translation" );
			}
		})( window.wp );
	</script>
	<p><a href="http://build.wp.dev/wp-admin/update-core.php" title="Go to WordPress Updates page" target="_parent">Return to WordPress Updates</a></p>
</div>
</div> 
<div class="clear"></div></div><!-- wpbody-content -->
<div class="clear"></div></div><!-- wpbody -->
<div class="clear"></div></div><!-- wpcontent -->

[michalzuber]

Thanks ocean90 ;)
Attached 28947.diff removes the footer that outputs a </div>

Language_Pack_Upgrader_Skin class is used only in the updater.

mike@mike:~/Sites/wordpress-git$ grep -r Language_Pack_Upgrader_Skin src
src/wp-admin/includes/class-wp-upgrader-skins.php:class Language_Pack_Upgrader_Skin extends
 WP_Upgrader_Skin {
src/wp-admin/includes/class-wp-upgrader.php:            $skin = new Language_Pack_Upgrader_Skin(
array(src/wp-admin/update-core.php:   $upgrader = new Language_Pack_Upgrader(
new Language_Pack_Upgrader_Skin( compact( 'url', 'nonce', 'title', 'context' ) ) );

[ocean90]

In 29313:

Remove parent::footer() in Language_Pack_Upgrader_Skin::bulk_footer() as it prints a closing div which is not needed.

props michalzuber.
fixes #28947.

[iseulde]

I'm still having this problem in the latest trunk.

[iseulde]

It looks like the #wpwrap is overflowing the body...

[iseulde]

Ah, in all other places the footer is *inside* #wpwrap. Here it's outside #wpwrap and a direct child of the body.

[iseulde]

And the HTML is still invalid... There's a stray end div tag.

[michalzuber]

Fixed for me ​https://youtu.be/b6Sxu2dylMc
Please could you describe your test case?

[iseulde]

Hm, maybe I did something wrong... I tried it again, without updating trunk and it seems to work fine. Maybe I updated the translations differently, I will reopen if I stumble upon this again...
I also have two scrollbars when plugins and translations are updated, but I'll make another ticket of that.

[ocean90]

When updating a plugin and translations are updated too you have another stray closing div tag.

Source snippet of the iframe:

<p>The update process is starting. This process may take a while on some hosts, so please be patient.</p>
<p>Enabling Maintenance mode&#8230;</p>
<h4>Updating Plugin WordPress Importer (1/1) <span class="spinner waiting-1"></span></h4>
<script type="text/javascript">jQuery('.waiting-1').css("display", "inline-block");</script>
<div class="update-messages hide-if-js" id="progress-1">
	<p>
	Downloading update from <span class="code">https://downloads.wordpress.org/plugin/wordpress-importer.0.6.1.zip</span>&#8230;<br />
	Unpacking the update&#8230;<br />
	Installing the latest version&#8230;<br />
	Removing the old version of the plugin&#8230;<br />
	Plugin updated successfully.<br />
	</p>
</div>
<div class="updated">
	<p>WordPress Importer updated successfully. <a onclick="jQuery('#progress-1').toggle();jQuery('span', this).toggle(); return false;" href="#" class="hide-if-no-js"><span>Show Details</span><span class="hidden">Hide Details</span>.</a></p>
</div>
<script type="text/javascript">jQuery('.waiting-1').hide();</script>
<script type="text/javascript">
	if ( window.postMessage && JSON ) {
		window.parent.postMessage( JSON.stringify( { action: "decrementUpdateCount", upgradeType: "plugin" } ), window.location.protocol + "//" + window.location.hostname );
	}
</script>
<p>Disabling Maintenance mode&#8230;</p>
<p>Some of your translations need updating. Sit tight for a few more seconds while we update them as well.</p>
<div class="update-messages lp-show-latest">
	<h4>Updating translations for WordPress (ar)&#8230;</h4>
	<p>Downloading translation from <span class="code">https://global.wordpress.org/builds/core/4.0-alpha/ar.zip</span>&#8230;</p>
	<p>Unpacking the update&#8230;</p>
	<p>Installing the latest version&#8230;</p>
	<p>Translation updated successfully.</p>
</div>
<script type="text/javascript">
	(function( wp ) {
		if ( wp && wp.updates.decrementCount ) {
			wp.updates.decrementCount( "translation" );
		}
	})( window.wp );
</script>
</div> // Not needed
<p>All updates have been completed.</p>
<p><a href="http://develop.wp.dev/wp-admin/plugins.php" title="Go to plugins page" target="_parent">Return to Plugins page</a> | <a href="http://develop.wp.dev/wp-admin/update-core.php" title="Go to WordPress Updates page" target="_parent">Return to WordPress Updates</a></p>

[ocean90]

Another one: When updating a single plugin you get:

<div class="wrap">
	<h2>Update Plugin</h2>
	<p>Downloading update from <span class="code">https://downloads.wordpress.org/plugin/debug-bar.0.8.1.zip</span>&#8230;</p>
	<p>Unpacking the update&#8230;</p>
	<p>Installing the latest version&#8230;</p>
	<p>Removing the old version of the plugin&#8230;</p>
	<p>Plugin updated successfully.</p>
	<iframe style="border:0;overflow:hidden" width="100%" height="170px" src="update.php?action=activate-plugin&amp;networkwide&amp;plugin=debug-bar%2Fdebug-bar.php&amp;_wpnonce=01efc775fa"></iframe>
	<script type="text/javascript">
		(function( wp ) {
			if ( wp && wp.updates.decrementCount ) {
				wp.updates.decrementCount( "plugin" );
			}
		})( window.wp );
	</script>
	<p><a href="http://develop.wp.dev/wp-admin/plugins.php" title="Go to plugins page" target="_parent">Return to Plugins page</a></p>
	<p>Some of your translations need updating. Sit tight for a few more seconds while we update them as well.</p>
	<div class="update-messages lp-show-latest">
		<h4>Updating translations for WordPress (ar)&#8230;</h4>
		<p>Downloading translation from <span class="code">https://global.wordpress.org/builds/core/4.0-alpha/ar.zip</span>&#8230;</p>
		<p>Unpacking the update&#8230;</p>
		<p>Installing the latest version&#8230;</p>
		<div class="lp-error">
			<p>Invalid Data provided.</p>
		</div>
		<p>Translation update failed.</p>
	</div>
</div>
</div>
<div class="clear"></div></div><!-- wpbody-content -->
<div class="clear"></div></div><!-- wpbody -->
<div class="clear"></div></div><!-- wpcontent -->

[ocean90]

In 29358:

Language Upgrader: Don't print a footer when translations are updated async.

fixes #28947.