Using emmet extension to expand html tag abbreviations in Brackets when live preview is active, it doesn't update and shows
Live Preview (not working due to syntax error)
If for example I write:
ul>li*3
and press tab it expands into
<ul>
<li></li>
<li></li>
<li></li>
</ul>
and Brackets stop its live preview update.
Are you putting the <ul> inside a <p> tag? Technically that isn't legal HTML – for example see this SO answer. Lists can be inside a div, but not a paragraph.
If that's not the problem, could you post a code snippet that shows where you're inserting the <ul>?
Related
We had Selenium tests running on Sales Force non Lightning. Now I am converting to Lightning. There is a chain of menus to go through. I have successfully navigated to a certain menu, but now I have run into a problem. This is not the standard question about new element names. Here is the question. This is a small piece of what the page looks like (see below).
When using inspect with Chrome I can find the elements. This is what it looks like (a small cross section corresponding to above). The SPAN tag has the label ("Original Agreement") and the DIV below it will contain the box for the input value.
<div class="slds-form-element__control" data-aura-rendered-by="228:1224;a">
<div data-aura-rendered-by="1108:0" class="uiInput forceSearchInputLookupDesktop uiInput--default" data-aura-class="uiInput forceSearchInputLookupDesktop uiInput--default">
<label class="label inputLabel uiLabel-left form-element__label uiLabel" for="157:1224;a" data-aura-rendered-by="1103:0" data-aura-class="uiLabel">
<span class="" data-aura-rendered-by="1104:0">Original Agreement</span>
<!--render facet: 1106:0--><!--render facet: 1107:0--></label>
<div data-aura-rendered-by="161:1224;a"><div class="contentWrapper slds-box--border" data-aura-rendered-by="162:1224;a">
However, Selenium can not find the elements (though inspect does). When I did a "View Page Source instead of an
inspect, almost the entire thing is in JavaScript like this:
function rewriteAndInjectCss(linkEl, source, varLookup) {
var css = rewriteCssVars(source, varLookup);
injectStyles(linkEl, css);
}
but a lot more. Almost all functions, with maybe only a couple elements.
In the past when I have seen something similar there is often an iframe to switch to to get the elements. But there is no iframe to switch to. So I am stuck how to get these. Can anyone shed some light?
OK. Found it. I needed to do a driver.switchTo().defaultContent()
I am working on a legacy application that is being rewritten using Aurelia, the application has a bunch of static html in a tblHelp that needs to be displayed. I am using innerhtml.bind on a div in my view to databind the stored static HTML into the view. Each record is essentially a document complete with a full table of contents that links to other divs within the document (Bookmarks).
Something like:
<div id="toc">
<h1>Table of Contents</h1>
<ul>
<li>Section 1<li>
<li>Section 2<li>
</ul>
</div>
<div id="section1">
<h2>Section 1</h2>
<p>Paragraph Text...</p>
<p>Back to Table of Contents</p>
</div>
<div id="section2">
<h2>Section 2</h2>
<p>Paragraph Text...</p>
<p>Back to Table of Contents</p>
</div>
When I display the resulting page in my Aurelia view and click on the links, rather than moving to the proper Div on the current page, it seems to be attempting to route to an unknown route and ends up returning to the home page (that is my unknown route behavior). How do I make the Aurelia Router know that I am just moving around the same page and do not require it to route to another page?
I think you need to change your <div id= to <a id= which is the correct syntax for anchors. Hopefully Aurelia will recognize them as legitimate anchors when formatted correctly.
Also, since an anchor tag shouldn't wrap the whole content, you'll just open and close it at the top of the div. You can even leave the divs there but should not duplicate the id.
Update:
That being said, I created a GistRun that actually demonstrates that Aurelia should be able to handle the <div id= anchor targets. So, I'm not exactly sure why you're having problems.
Maybe this GistRun or the more standard <a id= approach will help you.
When trying to use Emmet to do any style settings in an html file, instead of using the autocomplete, it creates a new tab, e.g., if I have the following
<div>
and I want to add a margin of 10px, I add
<div style="m10
then press tab and instead of
<div style="margin:10px;">
I get
<div style="<m10></m10>"
Most of the other Emmet functions, creating lists, div with class, work fine. I'm using Brackets 0.42 and have tried uninstalling and reinstalling Emmet. Any suggestions?
Based on the Cheat Sheet here you can't do that.
The html file only parse emmet magic code like ul>li*4.. or building tags like div [TAB] -> <div></div>
In css as you know you can use m10 [TAB] to get margin: 10px;.
(Styling inline in html isn't a good approach if you can avoid it)
EDIT: What you can actually do to keep your workflow is:
type div [TAB] -> <div></div>
click in the open or closing div
press CTRL+E (Quick Edit) and define a new style in your css file for this specific div. Emmet works in the Quick Edit window as intended.
This is the best valid way.
This question is about Blogger Template manipulation. People developing/changing or manipulating Blogger templates in any way know its syntax hence can provide some input.
I write a development blog on Blogger and I've changed my blog template so posts display HTML head title differently (post name first) from default (blog name first).
But. Since I format my inline programming code words similarly to Stackoverflow (gray background mono-spaced font) and do the same when I use any of them in blog post title... I enclose such code words inside <code/> element and then I have CSS set for this particular element to add it gray background and set mono-spaced font on it. This formatting works on blog post titles and its content.
But the problem I'm having is that these <code/> tags I use are also displayed in the HTML head title (displayed in browser window title). What is even more importan is that these get displayed in web search results as well. That's even more annoying.
Default template uses <data:blog.pageTitle/> in title element, which strips out any tags, but displays all titles as Blog Name: Blog post title (Google search results are quite meaningless because blog post title gets cut off). That's why I'm using <data:blog.pageName/> instead to display just blog post title in the head, but it still has all tags and I should strip them out somehow.
Check this blog post example. Load it, and look at browser's window title bar that still has tags displayed. I want them gone.
How do I strip tags from the post title when adding it to head element?
UPDATED
ok, so far this is what i worked out:
under settings -> Title -> put a nice
use <data:blog.pageTitle/> as title;
under design -> edit html -> replace theese lines
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title=' (Intestazione)' type='Header'/>
</b:section>
with your custom header like
<div class="header section" id="header">
<div class="widget Header" id="Header1">
<div id="header-inner">
<div class="titlewrapper">
<h1 class="title">
aSeptik Site</h1>
</div>
<div class="descriptionwrapper">
<p class="description">
<span>
</span>
</p>
</div>
</div>
</div>
</div>
<title> will result from:
jQuery <em>"scroll into view"</em> plugin (with an additional <code>":scrollable"</code> selector filter)
to
: jQuery "scroll into view" plugin (with an additional ":scrollable" selector filter)
hope this help, demo http://aseptik.blogspot.com/2011/02/jquery-scroll-into-view-plugin-with.html
try with a little bit of javascript in your <body> like this
<script type='text/javascript'>
document.title = document.title.replace(/(<([^>]+)>)/ig,'');
</script>
</body>
copy and past as is don't convert entities,
DEMO: http://aseptik.blogspot.com/2011/02/jquery-scroll-into-view-plugin-with.html
although, i'm not sure this is the
right solution for you since spiders
usually avoid js execution, and i
don't know how "html tags in the title"
affects the search results.
One of my most common operations in textmate is to encapsulate a block of text in a <div>.
How can i create a keyboard shortcut for this? I do not really feel like learning anything complex, so simple solutions would work best - thanks!
Maybe I didn't understand your question, but what about the "Wrap Selection in Open/Close Tag" (Ctl-Shift-W) from the HTML bundle? Having a block of text selected then overtyping the default <p> with <div> does the work. See http://manual.macromates.com/en/bundles#html
But the following snippet :
${0:${TM_SELECTED_TEXT/\A(.)<\/div>\z|./(?1:$1:$0<\/div>)/m}}
does the same thing without even typing the tag ...
HTH
This might slightly off topic, but you might be interested in using Zen coding for Textmate, which allows you produce lots of HTML with a few key strokes.
You write:
div#page>div.logo+ul#navigation>li*5>a
You get:
<div id="page">
<div class="logo"></div>
<ul id="navigation">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
(disclaimer: the example code is from the above mentioned site)
Besides that it adds features for easy navigation of editable parts of HTML, for easy wrapping of content using the same syntax as above. This last past would allow you to wrap any text (content) in whatever HTML you would like.
Happy coding :)