Kramdown not showing in heroku (Rails app) - ruby-on-rails

I am using gem kramdown, locally is working, but not in production. Here are the results locally:
content: "~~~ ruby\r\ndef what?\r\n 42\r\nend\r\n~~~",
kramdown_to_html(subthema.content.html_safe)
=> "<div class=\"language-ruby highlighter-coderay\"><div
class=\"CodeRay\">\n <div class=\"code\"><pre><span
style=\"color:#080;font-weight:bold\">def</span> <span
style=\"color:#06B;font-weight:bold\">what?</span>\n <span
style=\"color:#00D\">42</span>\n<span style=\"color:#080;font-
weight:bold\">end</span>\n</pre></div>\n</div>\n</div>\n"
As you see, the piece of code is translated into right HTML, every code-word is within a span and every span has its own class (then with CSS you give the styling).
In production though, here are the results, doing exactly the same:
irb(main):010:0> subthema.content.html_safe
=> "~~~ ruby\r\ndef what?\r\n 42\r\nend\r\n~~~"
irb(main):011:0> kramdown_to_html(subthema.content)
=> "<pre><code class=\"language-ruby\">def what?\n 42\nend\n</code>
</pre>\n"
As you see, the span tags are not there. In Heroku, Kramdown just achieves to create pre and code tagsm but not the spans.
Any help in this topic?
Thanks in advance.

Related

Capybara::Poltergeist::MouseEventFailed after Haml update (4.0.7 => 5.0.2) [RAILS]

Hi we are currently updating our HAML file from version 4.0.7 to 5.0.2. After the update a lot of cucumber tests break saying;
Firing a click at co-ordinates [422.5, 414] failed.
Poltergeist detected another element with CSS selector 'html.javascript body div.ui-widget-overlay.ui-front' at this position.
It may be overlapping the element you are trying to interact with.
If you don't care about overlapping elements, try using node.trigger('click').
(Capybara::Poltergeist::MouseEventFailed)
It breaks at the parts where i'm using interpolation in i18n texts like this:
You_are_on_a_device: You are on a %{type} device
And in the view im using something like this:
%p.dialog{'data-attribute' => t('you_are_on_a_device', type: 'small').html_safe, hidden: true}
I can't seem to find the breaking change from the Haml Changelog
Does anybody know whats causing this and what i can do to fix this?
Solved:
The solution was to put the data attributes value in an interpolated string like this:
%p.dialog{'data-attribute' => "#{t('you_are_on_a_device', type: 'small').html_safe}", hidden: true}
and in my config/initializers/haml.rb
Haml::Template.options[:escape_html] = false
It was because of the html escaping that has become standard in HAML 5.0.0, where it wasn't in HAML 4.0.7
Disabling html escaping is NOT a good practice because it makes your app prone to XSS attacks. For example, when an attacker type in their username <script>alert('Vasya')</script> other users will see an alert every time Vasya's name will appear on the page. Try the following code:
%p= "<script>alert('Vasya')</script>"
I installed haml 5.0.2 in a fresh rails project (rails 4.2.6) and I tried to render the following page:
%h1 HAML
%p.dialog{'data-attribute' => t('you_are_on_a_device', type: 'small').html_safe, hidden: true}
%p.dialog{'data-attribute' => "#{t('you_are_on_a_device', type: 'small').html_safe}", hidden: true}
I don't see any differences in the rendered p tags (I've tried both escape_html true and false):
<h1>HAML</h1>
<p class="dialog" data-attribute="You are on a <a href="http://mywebsite.nl/type">small</a> device" hidden=""></p>
<p class="dialog" data-attribute="You are on a <a href="http://mywebsite.nl/type">small</a> device" hidden=""></p>
I guess that the Failed to click on element issue is caused by other reason, maybe you upgraded capybara or capybara-related gem while upgrading haml
Also it is a good practice to render data-attributes using hash notation:
%p.dialog{data: { attribute: t('you_are_on_a_device', type: 'small').html_safe }, hidden: true}
See more detailed documentation on the haml data attributes here

Nokogiri results different from brower inspect

I am trying to scrape a site but the results returned for just the links is different from when I inspect it with the browser.
In my browser I get normal links but all the a HREF links all become javascript:void(0); from Nokogiri.
Here is the site:
https://www.ctgoodjobs.hk/jobs/part-time
Here is my code:
url = "https://www.ctgoodjobs.hk/jobs/part-time"
response = open(url) rescue nil
next unless response
doc = Nokogiri::HTML(open(url))
links = doc.search('.job-title > a').text
is not that easy, urls are "obscured" using a js function, that's why you're getting javascript: void(0) when asking for the hrefs... looking at the html, there are some hidden inputs for each link, and, there is a preview url that you can use to build the job preview url (if that's what you're looking for), so you have this:
<div class="result-list-job current-view">
<input type="hidden" name="job_id" value="04375145">
<input type="hidden" name="each_job_title_url" value="barista-senior-barista-咖啡調配員">
<h2 class="job-title">Barista/ Senior Barista 咖 啡 調 配 員</h2>
<h3 class="job-company">PACIFIC COFFEE CO. LTD.</h3>
<div class="job-description">
<ul class="job-desc-list clearfix">
<li class="job-desc-loc job-desc-small-icon">-</li>
<li class="job-desc-work-exp">0-1 yr(s)</li>
<li class="job-desc-salary job-desc-small-icon">-</li>
<li class="job-desc-post-date">09/11/16</li>
</ul>
</div>
<a class="job-save-btn" title="save this job" style="display: inline;"> </a>
<div class="job-batch-apply"><span class="checkbox" style="background-position: 0px 0px;"></span><input type="checkbox" class="styled" name="job_checkbox" value="04375145"></div>
<div class="job-cat job-cat-de"></div>
</div>
then, you can retrieve each job_id from those inputs, like:
inputs = doc.search('//input[#name="job_id"]')
and then build the urls (i found the base url at joblist_preview.js:
urls = inputs.map do |input|
"https://www.ctgoodjobs.hk/english/jobdetails/details.asp?m_jobid=#{input['value']}&joblistmode=previewlist&ga_channel=ct"
end
Take the output of a browser and that of a tool like wget, curl or nokogiri and you will find the HTML the browser presents can differ drastically from the raw HTML.
Browsers these days can process DHTML, Nokogiri doesn't. You can only retrieve the raw HTML using something that lets you see the content without the browser, like the above mentioned tools, then compare that with what you see in a text editor, or what nokogiri shows you. Don't trust the browser - they're known to lie because they want to make you happy.
Here's a quick glimpse into what the raw HTML contains, generated using:
$ nokogiri "https://www.ctgoodjobs.hk/jobs/part-time"
Nokogiri dropped me into IRB:
Your document is stored in #doc...
Welcome to NOKOGIRI. You are using ruby 2.3.1p112 (2016-04-26 revision 54768) [x86_64-darwin15]. Have fun ;)
Counting the hits found by the selector returns:
>> #doc.search('.job-title > a').size
30
Displaying the text found shows:
>> #doc.search('.job-title > a').map(&:text)
[
[ 0] "嬰 兒 奶 粉 沖 調 機 - 兼 職 產 品 推 廣 員 Part Time Promoter (時 薪 高 達 HK$90, 另 設 銷 售 佣 金 )",
...
[29] "Customer Services Representative (Part-time)"
]
Looking at the actual href:
>> #doc.search('.job-title > a').map{ |n| n['href'] }
[
[ 0] "javascript:void(0);",
...
[29] "javascript:void(0);"
]
You can tell the HTML doesn't contain anything but what Nokogiri is telling you, so the browser is post-processing the HTML, processing the DHTML and modifying the page you see if you use something to look at the HTML. So, the short fix is, don't trust the browser if you want to know what the server sends to you.
This is why scraping isn't very reliable and you should use an API if at all possible. If you can't, then you're going to have to roll up your sleeves and dig into the JavaScript and manually interpret what it's doing, then retrieve the data and parse it into something useful.
Your code can be cleaned up and simplified. I'd write it much more simply as:
url = "https://www.ctgoodjobs.hk/jobs/part-time"
doc = Nokogiri::HTML(open(url))
links = doc.search('.job-title > a').map(&:text)
The use of search(...).text is a big mistake. text, when applied to a NodeSet, will concatenate the text of each contained node, making it extremely difficult to retrieve the individual text. Consider this:
require 'nokogiri'
doc = Nokogiri::HTML(<<EOT)
<html>
<body>
<p>foo</p>
<p>bar</p>
</body>
</html>
EOT
doc.search('p').class # => Nokogiri::XML::NodeSet
doc.search('p').text # => "foobar"
doc.search('p').map(&:text) # => ["foo", "bar"]
The first result foobar would require being split apart to be useful, and unless you have special knowledge of the content, trying to figure out how to do it will be a major pain.
Instead, use map to iterate through the elements and apply &:text to each one, returning an array of each element's text.
See "How to avoid joining all text from Nodes when scraping" and "Taking apart a DHTML page" also.

Aptana Studio 3 Snippet Around Selection

So I have recently switched from Dreamweaver to Aptana Studio 3 and I have been playing around with the whole custom snippet feature. For the life of me though I cannot figure out how to take a selection/highlighted text and wrap it with my own custom code and/or text. I have looked around the internet for three days now and cannot find anything regarding snippets. I have found some things using commands and key combinations, but I am wanting to create and use a snippet and trying to modify what I have found is not producing good fruit.
I have been able to create my own category and some basic snippets that insert straight text, but nothing that uses a selection.
I have absolutely NO experience with Ruby so forgive me if what follows is completely atrocious. I have more experience with PHP, HTML, Javascript, Java, etc. Here is what I have so far.
snippet "Selection Test" do |snip|
snip.trigger = "my_code"
snip.input = :selection
selection = ENV['TM_SELECTED_TEXT'] || ''
snip.expansion = "<test>$selection</test>\n"
snip.category = "My Snippets"
end
I haven't done much with custom Snippets, but if it helps, there is an example in the HTML bundle of a snippet that surrounds the selected text with <p></p> tags when you do Ctrl + Shift + W. You can see the code for it in snippets.rb in the HTML bundle:
with_defaults :scope => 'text.html - source', :input => :none, :output => :insert_as_snippet do |bundle|
command t(:wrap_selection_in_tag_pair) do |cmd|
cmd.key_binding = "CONTROL+SHIFT+W"
cmd.input = :selection
cmd.invoke do |context|
selection = ENV['TM_SELECTED_TEXT'] || ''
if selection.length > 0
"<${1:p}>${2:#{selection.gsub('/', '\/')}}</${1:p}>"
else
"<${1:p}>$0</${1:p}>"
end
end
end
end
I fiddled around with putting it into the PHP bundle for a few minutes under CTRL + Shift + P and got it working in HTML files, which was not my goal... but was progress. I may play around with it some more later, but in the meantime, maybe you know enough after all of your research to get something put together. I would be interested to see your results if you get this figured out.

Aptana / Eclipse Support for "js.erb", "css.erb" files

I'm working on jRuby on Rails app in Eclipse. I recently install Aptana to better support the rails files. This provides reasonable highlighting and support for most file types includes "html.erb" files but not for other *.erb files.
It's driving me insane their must be some editor that doesn't give me a damn syntax error when I use ruby tags in js.erb files. It seems like such a basic function.
Any advice is appreciated. I am open to pretty much anything I just want some way to write javascript in erb files without a million syntax errors after every ruby tag.
This example give me a syntax error in the editor despite working perfectly fine when I run the app:
<%= render :partial => 'qunit/frame_wrapper_top' -%>
module("Carousel");
asyncTest('Slider Right Button', 1, function() {
setTimeout(function() {
var center_image = frame.find('.carouselContainer li img.current').attr('id');
var e = $q.Event("click");
$('.navButton_right').trigger( e );
setTimeout(function(){
start();
var current_center = frame.find('.carouselContainer li img.current').attr('id');
notEqual( current_center, center_image, "New item is in center");
}, 1000);
},1000);
});
I'm also looking for an editor or IDE that can handle .js.erb. Aptana (3.0.9 or 3.2.0) only seems to recognise the ERB part, the JS does not get highlighted. Maybe Emacs+nXhtml will work.
Update: nXhtml does do the job for emacs. Load the file in your ~/.emacs as described in the README, then M-x eruby-javascript-mumamo-mode !

Compiling javascript templates with Jammit gem for Rails?

We're on Rails (3.0.3 / 1.9) using Jammit for static compression and all the other front-end goodies it provides.
I'm trying to work Javscript templates in to replace some ugly front-end code, but it looks like the default JST compiler can't handle Windows line breaks:
assets.yml file:
embed_assets: on
javascripts:
plugins:
- app/views/**/*.jst
When I have _topicPreview.jst all on one line it compiles fine:
<div class='TopicPreview <%= typeName %>'><div class='Title'> <%= summary %> </div><div class='Meta'> <span class='LastUpdate'> <%= updatedAt %> </span> <span class='PostCount'> | <%= postsCount %> Posts | </span> <span class='LikeCount'> <%= likesCount %> Likes </span> </div></div>
The page loads and I have the JST._topicPreview([JSON version of topic]) method available. Beautiful.
Half the appeal of JST is the readability / maintainability though, so I would like my JST to have proper formatting. As soon as I add line breaks into the JST file the page throws Uncaught SyntaxError: Unexpected Token ILLEGAL in window.JST['_topicPreview'] = template('...[the escaped JST file]...')
In the code trace I can see that it parses and escapes single quotes, so I was surprised it couldn't handle the line breaks.
Has anyone else encountered this problem?
Is there a cleaner fix than hacking some extra string replaces into the template generation code?
Meta:
I'm pretty new to javascript templates, but should they have their own StackOverflow tag?
Edit
Looks like this is a known issue with a pending fix to be merged into the gem.
Windows line breaks in Jammit JST compiler
Fix has been added to the gem. Windows developers rejoice.

Resources