rails haml ugly weird behaviour - ruby-on-rails

I have the following helper:
def feeder value=true
if feeder? == value
haml_tag :span, :<, :class => 'selected' do
yield
end
else
yield
end
end
And the following in a view:
- feeder(false) do
= link_to 'Leda', :root
This works as expected in haml non-ugly mode (development environment == haml indented code).
However in production mode (e.g. haml ugly rendering) i get this html:
<h1>
Leda
<!-- THIS SHOULD NOT BE HERE >>> -->
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>Feeder</title>
<meta name="csrf-param" content="authenticity_token"/>
<meta name="csrf-token" content="8kp4xt6ZJU2nL5uLgVBW6BcB/RTA75QwynKvZTMtNF8="/>
<link href="/leda/stylesheets/jquery-ui/smoothness/jquery-ui.css?1297978005" media="screen" rel="stylesheet" type="text/css" />
<link href="/leda/stylesheets/admin.css?1298951622" media="screen" rel="stylesheet" type="text/css" />
<script src="/leda/javascripts/jquery.js?1297978005" type="text/javascript"></script>
<script src="/leda/javascripts/jquery-ui.js?1297978004" type="text/javascript"></script>
<script src="/leda/javascripts/rails.js?1297978005" type="text/javascript"></script>
<script src="/leda/javascripts/application.js?1300153136" type="text/javascript"></script>
</head>
<body>
<div id='wrapper'>
<div id='header'>
<h1>
Leda
<!-- <<< END -->
»
<span class='selected'>gvm1</span>
</h1>
Replacing the else clause with this:
else
haml_tag :span do
yield
end
end
fixes the problem, but i can't possibly understand why/how. What puzzles more is that it only fails on haml ugly rendering mode.

Why not just do it all in the view, like this?
%span{:class => blah.feeder? && "selected"}= link_to 'Blah', blah
(haml docs on this are right here.)
Your helper version seems unnecessarily complex.

Related

Angular 2 with ASP.NET Core duplicating <html><body>

I have setup Angular 2 with ASP.NET core, using:
dotnet new --install Microsoft.AspNetCore.SpaTemplates::*
I followed the standard setup but the App.component.html is duplicating the html and body tags.
When Pressing Control U (to view source) the html looks like:
<html>
<head>
....
</head>
<body>
<app>
<html>
<head>
<style>
...
</style>
</head>
</app>
</body>
</html>
</app>
...
</body>
</html>
redacted
None of my components have html or body tags in them. the only one that has html or body tag is the initial page
My _Layout.cshtml html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>#ViewData["Title"] - HotSnail</title>
<base href="/" />
<script src="~/content/modules/jquery/jquery-3.2.1.min.js"></script>
<script src="~/content/modules/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<link rel="stylesheet" href="~/dist/vendor.css" asp-append-version="true" />
<link href="~/content/modules/font-awesome-4.7.0/css/font-awesome.css" rel="stylesheet" />
<link href="~/content/modules/animate/animate.css" rel="stylesheet" />
<link href="~/content/global.css" rel="stylesheet" />
</head>
<body>
#RenderBody()
#RenderSection("scripts", required: false)
</body>
</html>
My Index.cshtml
<script src="~/dist/vendor.js" asp-append-version="true"></script>
#section scripts {
<script src="~/dist/main-client.js" asp-append-version="true"></script>
}
The above code is what should be served, now the first bit of angular should be the app.component
app.component.html
<ribbon></ribbon>
<div id="content">
<router-outlet></router-outlet>
</div>
ribbon.component.html:
<div id="ribbon">
<span class="ribbon-button-alignment">
<span id="refresh" class="btn btn-ribbon" data-action="resetWidgets" data-title="refresh" rel="tooltip" data-placement="bottom" data-original-title="<i class='text-warning fa fa-warning'></i> Warning! This will reset all your widget settings." data-html="true" data-reset-msg="Would you like to RESET all your saved widgets and clear LocalStorage?"><i class="fa fa-refresh"></i></span>
</span>
<!-- breadcrumb -->
<ol class="breadcrumb"><li>Home</li><li>Outlook</li><li>Inbox</li></ol>
</div>
This is all the components that should be injected on the first page
UPDATE*
So I have done some more research and it seems to be a known bug. As it says here:
https://github.com/aspnet/JavaScriptServices/issues/662
I cant quiet figure out their hacky solution
Here is hacky code that fixes this:
return requestZone.run>(() =>
platform.serializeModule(AppModule)).then(html => { resolve({ html:
html.slice(27, html.length - 14).replace('', '') }); },
reject);
Also in index.cshtml I advice changing app to div because we already
have app tag returned from Universal.
Loading...
I'm not sure where that code would go..
UPDATE
This also happens in the DEFAULT project created when doing
dotnet new angular
Does anyone know who maintains these templates as I'd like to post a bug with the development team
Same problem for angular 5.
I fixed it like in suggestion from last comment on https://github.com/aspnet/JavaScriptServices/issues/662 (last comment by salarcode):
boot.server.ts file change the code to this:
resolve({
html: (() => {
let apphtml = state.renderToString();
apphtml = apphtml.replace('<html><head><style>', '<style>').replace('</head><body><app', '<app').replace('</app></body></html>', '</app>');
return apphtml;
})()});

Laravel Blade does not include css and .js present in template

I need, from a view-blade, to search a database in order to fetch data and display them in another view-blade when a link is clicked.
I made the following:
In the view-blade who will acting on database:
#foreach($pending as $p)
<tr>
<td>
Click here
</td>
</tr>
#endforeach
the connected 'route' is
Route::get("/getMyForm/{ident}", ['as' => "openMyPage", 'uses' => "BusinessController#seeMyForm"]);
the method on BusinessController has
public function seeMyForm($ident){
$myResult=DB::select(...);
return view('MyViewBlade')->with('myResult', $myResult);
}
the master template (PrincipalView.blade.php) (as was included in the view-blade to display
<!DOCTYPE html>
<html>
<head>
<meta name="csrf_token" content="{{ csrf_token() }}" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/css/bootstrap-theme.min.css" rel="stylesheet">
<link href="assets/css/bootstrap-datepicker.min.css" rel="stylesheet">
<!-- <link rel="stylesheet" href="assets/js/jquery-ui/jquery-ui.css"> -->
<script src="assets/js/jquery.js"></script>
<!-- <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> -->
<script src="assets/js/bootstrap-datepicker.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet">
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
<script src="assets/js/jquery-ui-1.11.4.custom/jquery-ui.js"></script>
<link rel="stylesheet" href="assets/js/jquery-ui-1.11.4.custom/jquery-ui.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="assets/js/jquery-pessoal.js"></script>
<script src="assets/js/jquery-pessoal2.js"></script>
<link rel="stylesheet" href="assets/plugins/multiple-select-master/multiple-select.css"></script>
<script src="assets/plugins/multiple-select-master/multiple-select.js"></script>
<link href="assets/css/custom.css" rel="stylesheet">
</head>
...
<div class="container">
#yield("corpo")
</div>
...
the view-blade which will display (ToAproveView.blade.php)
#extends('PrincipalView')
#section('corpo')
<div class="row">
<div class="col-sm-6">
<div class="form-group">
<label>Cliente Principal: </label><br>
<input type="text" id="idTxtFaturamentoAprovacaoCliente"
name="namTxtFaturamentoAprovacaoCliente"
readonly value="{{$myResult[0]->clienteprincipal}}"/>
</div>
</div>
is not working. The last view-blade do not render its elements. The view opens itself not well formatted.
Other actions make all other views-blade ok.
I found out, the problem is connected with the line code
Click here
because it was created on the fly (I guess).
Looking at the console of Chrome, is there
GET http://172.16.0.30/laravel/tempo/public/pesquisar-Faturamento-verFormulario/assets/css/bootstrap-theme.min.css
29638_1472048778961_121:16 GET http://172.16.0.30/laravel/tempo/public/pesquisar-Faturamento-verFormulario/assets/css/bootstrap-datepicker.min.css
29638_1472048778961_121:18 GET http://172.16.0.30/laravel/tempo/public/pesquisar-Faturamento-verFormulario/assets/js/jquery.js
29638_1472048778961_121:13 GET http://172.16.0.30/laravel/tempo/public/pesquisar-Faturamento-verFormulario/assets/css/bootstrap.min.css
29638_1472048778961_121:22 GET http://172.16.0.30/laravel/tempo/public/pesquisar-Faturamento-verFormulario/assets/js/bootstrap-datepicker.js
29638_1472048778961_121:28 GET http://172.16.0.30/laravel/tempo/public/pesquisar-Faturamento-verFormulario/assets/js/jquery-ui-1.11.4.custom/jquery-ui.js
net::ERR_CONNECTION_RESET
29638_1472048778961_121:29 GET http://172.16.0.30/laravel/tempo/public/pesquisar-Faturamento-verFormulario/assets/js/jquery-ui-1.11.4.custom/jquery-ui.css
net::ERR_CONNECTION_RESET
29638_1472048778961_121:23 GET http://172.16.0.30/laravel/tempo/public/pesquisar-Faturamento-verFormulario/assets/js/bootstrap.min.js
net::ERR_CONNECTION_RESET
The including css and js files do not work (the names in the path are different of that I was wrote abore because I made a translation to better comprehension)
I found out where the error is.
I changed the path to .js and css files in default template and the view rendered correctly:
<link href="../assets/css/bootstrap.min.css" rel="stylesheet">
Although there is not the correct answer, since this template serves several views-blade that work perfectly, for now it is ok to me.

rspec capybara selector rails 4

I am trying to write an rspec test that will;
visit the store page
select a value in the Countries select box
and test that the value exists (initially in the Countries box but I would also be testing for cities which is dependent on Country in the second test)
HTML page
<!DOCTYPE html>
<html>
<head>
<title>Ruby on Rails Tutorial Sample App</title>
<link data-turbolinks-track="true" href="/assets/application.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/custom.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/password_resets.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/people.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/products.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/scaffolds.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/sessions.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/static_pages.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/store.css?body=1" media="all" rel="stylesheet" />
<link data-turbolinks-track="true" href="/assets/users.css?body=1" media="all" rel="stylesheet" />
<script data-turbolinks-track="true" src="/assets/jquery.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery_ujs.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/bootstrap.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/password_resets.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/people.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/products.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/sessions.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/static_pages.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/store.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/users.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/application.js?body=1"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="NcsV3Ve7QqLTjeLNz5MLuCxzvG8urc63NiDk7RZTGtM=" name="csrf-token" />
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<header class="navbar navbar-fixed-top navbar-inverse">
<div class="navbar-inner">
<div class="container">
sample app
<nav>
<ul class="nav btn-group navbar-nav navbar-right list-inline">
<li>Home</li>
<li>Help</li>
<li>Sign in</li>
</ul>
</div>
</ul>
</nav>
</div>
</div>
</header>
<div class="container">
<h2>some text</h2>
<div class="row">
<div class="col-md-4 col-md-offset-4">
<div class="row">
<div class="col-md-6 col-md-offset-2">
<form accept-charset="UTF-8" action="/store/show" method="get"><div style="display:none"><input name="utf8" type="hidden" value="✓" /></div>
<label for="catalogue_country">Country</label>
<select id="countries_select" name="catalogue[country_id]"><option selected="selected" value="1">France</option>
<option value="2">Italy</option>
<option value="3">United Kingdom</option></select>
<div class="pull-right">
<input class="btn brn-large btn-primary" name="commit" type="submit" value="Add to Cart" />
</form> </div>
</div>
</div>
</div>
</div>
<footer class="footer">
<small>
Rails Tutorial
by Michael Hartl
</small>
<nav>
<ul>
<li>About</li>
<li>Contact</li>
<li>News</li>
</ul>
</nav>
</footer>
<pre class="debug_dump">--- !ruby/hash:ActionController::Parameters
controller: store
action: index
</pre>
</div>
</body>
</html>
My test
require 'spec_helper'
describe "index" do
subject { page }
before do
visit store_path
select "United Kingdom", :from => "catalogue[country_id]"
end
it { should have_select('country_id', :selected => 'United Kingdom') }
end
The failures
Failures:
1) index
Failure/Error: visit store_path
NoMethodError:
undefined method `id' for nil:NilClass
The rails console [app.store_path] verifies that store_path is '/store'
The select boxes are dynamically populated according to the directions in this blog posting
Any help is appreciated, thanks in advance
There are the routes
match '/store', to: 'store#index', as: :store, via: 'get'
get 'store/show'
match 'store/update_cities', to: 'store#update_cities', as: :update_cities, via: 'get'
match 'store/update_currencies', to: 'store#update_currencies', as: :update_currencies, via: 'get'
Its one index page (store_path) which has a countries select box.
This is the store controller
def index
#countries = Country.all
#cities = City.where("country_id = ?", Country.first.id)
#currencies = Currency.where("country_id = ?", Country.first.id)
#locations = Location.where("city_id = ?", Location.first.id)
#products = Product.where("Location_id = ?", Product.first.id)
#plugs = Plug.where("Location_id = ?", Plug.first.id)
end
def show
end
def update_cities
#cities = City.where("country_id = ?", params[:country_id])
respond_to do |format|
format.js
end
end
Are you trying to visit a specific store, or listing all the stores ?
in your case you are trying to visit a specific store which you need to pass a parameter for it in this case the store id
To know the exact path write in the console:
rake routes
you will find each path to its url, if you want to list all the stores you need to write:
stores_path
instead of:
store_path
store_path is /store/:id

no styles rendered with root route

I came on this weird Rails issue: I added a root route to my route.rb file
root :to => 'pages#home'
however, when I enter:
http://localhost:3000
in the browser, the css styles for my home page do not show.
The odd thing is, that when I go to:
http://localhost:3000/home
the css does get rendered.
I'm using Rails 4.1.0
does anyone know what could be the problem?
ps:
my application.html.erb code looks like this:
<!DOCTYPE html>
<html>
<head>
<title>Mysite</title>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= csrf_meta_tags %>
</head>
<body>
<%= render "layouts/header" %>
<%= yield %>
<%= render "layouts/footer" %>
</body>
</html>
The header of my rendered page:
http://localhost:3000
looks like this:
<head>
<meta charset="utf-8">
<title>Anthony Candaele</title>
<link rel="stylesheet" href="css/style.css" />
</head>
However, when I go to:
http://localhost:3000/home
the header source of the rendered page looks like this:
<head>
<title>Mysite</title>
<link data-turbolinks-track="true" href="/assets/application.css?body=1" media="all" rel="stylesheet" />
<script data-turbolinks-track="true" src="/assets/jquery.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/jquery_ujs.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/turbolinks.js?body=1"></script>
<script data-turbolinks-track="true" src="/assets/application.js?body=1"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="UAWpX6x35EzVFSFyNPsaPPdE/0kEWqBQStCs9qWtOGc=" name="csrf-token" />
</head>

Rails render string with blank spaces in html file

When I do something like:
<%= c.title %>
Rails render it like this:
"
Title
"
This behavior isn't the same if I wrap the string with a tag. Can someone please explain me why Rails acts like this?
UPDATE
Github's Repo link
This has to do with ERB instead of Rails. When the template is processed it outputs any values from output ERB tags (<%= %>) to the output buffer and simply executes any other code.
Everything else is left untouched. Whitespace before and after the ERB tags is untouched. The most that you can do is to use - in the tags to have it strip some of the whitespace.
<!-- -->
<% for i in 1..10 %>
<%= i -%>
<% end %>
<!-- -->
Will output
<!-- foo -->
1 2 3 4 5 6 7 8 9 10<!-- foo -->
Note the two spaces that still show up before each number, take out that whitespace and it will look like one long number.
Compare this with
<% for i in 1..10 %>
<%= i %>
<% end %>
Will output
<!-- -->
1
2
3
4
5
6
7
8
9
10
<!-- -->
Here's the output from your test page after select View Source from the context menu.
<!DOCTYPE html>
<html>
<head>
<title>Testapp</title>
<link href="/assets/application-1b13569e9620782f423d4cd3ce931750.css" media="all" rel="stylesheet" type="text/css" />
<script src="/assets/application-9a717ea62eac3463d689b2ba0a4e85b4.js" type="text/javascript"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="/hfgtJZWzxaQ2d7txQMAt2b+21MWSTYcf6/2F7Pei1k=" name="csrf-token" />
</head>
<body>
<h1>Home#index</h1>
<p>Find me in app/views/home/index.html.erb</p>
What's wrong with me?
<!-- -->What's wrong with me surrounded by html commet<!-- -->
</body>
</html>
You probably have some indentation in your layout file or another file that renders this view.
Your application.html.erb may look like this :
<html>
<head>...</head>
<body>
<%= yield %> <!-- Some whitespaces at the beginning of this line -->
</body>
</html>
Rails simply replaces the <%= %> tags with the value of the expression in it, nothing more.
I don't see the problem. Here's the rendered HTML:
<!DOCTYPE html>
<html>
<head>
<title>Testapp</title>
<link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/home.css?body=1" media="all" rel="stylesheet" type="text/css" />
<script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/home.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="cOfMPm5S/tCHCEHkeRTeQTITAiz800s+3Q4ZgNWCNlY=" name="csrf-token" />
</head>
<body>
<h1>Home#index</h1>
<p>Find me in app/views/home/index.html.erb</p>
What's wrong with me?
</body>
</html>
The relevant layout section:
<body>
<%= yield %>
</body>
I got the same problem with you!
The solution for me is to change the file Encoding from UTF-8 to UTF-8 without BOM
I'm using sinatra, glad to share with you!

Resources