Le défi de stocker des données avec des variables sass a un problème.
L'agent utilisateur est: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36
.
<style>
$text-color: red;
.header{
text-align: center;
}
.blog-post h2 {
color: $text-color;
}
</style>
<h1 class="header">Learn Sass</h1>
<div class="blog-post">
<h2>Some random title</h2>
<p>This is a paragraph with some random text in it</p>
</div>
<div class="blog-post">
<h2>Header #2</h2>
<p>Here is some more random text.</p>
</div>
<div class="blog-post">
<h2>Here is another header</h2>
<p>Even more random text within a paragraph</p>
</div>
Bonjour à tous, je pense avoir trouvé un bug dans le défi Stockage de données avec des variables Sass. Je pense que j'ai tout fait correctement, mais la couleur des éléments h2 et .blog-post ne passe pas au rouge. Je passe deux des user stories mais pas celles-ci:
Votre élément .blog-post doit avoir une couleur rouge.
Vos éléments h2 doivent avoir une couleur rouge.
Il ne change pas non plus de rouge. Mais ça passe les user stories:
Votre code doit avoir une variable Sass déclarée pour $ text-color avec une valeur de rouge.
Votre code doit utiliser la variable $ text-color pour changer la couleur des éléments .blog-post et h2
Merci d'avance, et les nouveautés de la version bêta semblent incroyables, continuez votre excellent travail! J'ai hâte de travailler sur plus d'entre eux! 👍
@ Azbo400 Merci d'avoir signalé ce problème. Il semble que nous ne prenons pas encore en charge la compilation du Sass 😅
@systimotic Oh haha, c'est logique! Merci 😄
Oh pardon! Nous aurions dû avertir les gens que cette section ne fonctionnerait pas correctement. Merci pour le problème, @ Azbo400
@HKuz C'est bien, pas de problème. 😃
Ouais. Ça ne fonctionne pas. Y aura-t-il une notification lorsqu'elle sera corrigée?
Nous ne supportons pas encore les "saas"! Lmao !!!
Le 22 janvier 2017 à 00h19, "Pramod Potdar" [email protected] a écrit:
Ouais. Ça ne fonctionne pas. Y aura-t-il une notification lorsqu'elle sera corrigée?
-
Vous recevez ceci parce que vous êtes abonné à ce fil.
Répondez directement à cet e-mail, affichez-le sur GitHub
https://github.com/freeCodeCamp/freeCodeCamp/issues/12699#issuecomment-274311826 ,
ou couper le fil
https://github.com/notifications/unsubscribe-auth/AVHZeUIbLrZVFpBbIy0z9uTcDlOwHHoDks5rUvULgaJpZM4LqJWk
.
Ils ne veulent pas de sass de votre part. Blagues
Je suis d'accord que ce serait une bonne idée d'avertir les gens que Sass ne fonctionne pas encore.
En attendant, je recommande aux gens de suivre le guide de la page officielle Sass pour installer un compilateur Sass et de suivre leur guide (et / ou les tutoriels Sass de FCC) sur leurs propres machines. Le guide commence ici: http://sass-lang.com/install
Le défi de stockage de données avec des variables sass doit avoir ses deux derniers tests refactorisés afin de pouvoir vérifier l'utilisation de la variable affectée
@ahmadabdolsaheb Génial - bon appel. Avez-vous une idée de la façon de les refactoriser?
@QuincyLarson je suis dessus
ce qui suit pourrait être utile si quelqu'un veut s'attaquer à ce problème.
l'emplacement des tests à refactoriser:
https://github.com/freeCodeCamp/freeCodeCamp/blob/6d7092928e852755fa0d4d9489b3c8748b466a94/seed/challenges/03-front-end-libraries/sass.json#L25
les quatre tests doivent être remplacés par les deux suivants.
"tests": [
{
"text": "Your code should have a Sass variable declared for <code>$text-color</code> with a value of red.",
"testString": "assert(code.match(/\\$text-color\\s*?:\\s*?red\\s*?;/g), 'Your code should have a Sass variable declared for <code>$text-color</code> with a value of red.');"
},
{
"text": "Your code should use the <code>$text-color</code> variable to change the <code>color</code> for the <code>.blog-post</code> and <code>h2</code> items.",
"testString": "assert(code.match(/\\.blog-post\\s*?\,\\s*?h2\\s*?{\\s*?color:\\s*?\\$text-color\\s*?;/g), 'Your code should use the <code>$text-color</code> variable to change the <code>color</code> for the <code>.blog-post</code> and <code>h2</code> items.');"
}
]
veuillez tester la solution avant de faire un PR
@ahmadabdolsaheb
veuillez tester la solution avant de faire un PR
Comment dois-je procéder pour le tester? Si j'apporte des modifications aux fichiers de départ qui résident dans le repo freecodecamp
cela ne sera pas reflété dans le repo learn
car il utilise le module de nœud @freecodecamp/curriculum
pour relever les défis.
Même si j'apporte les modifications dans le repo curriculum
localement, cela ne sera pas reflété dans le repo learn
.
Je suis en train de suivre les cours Sass.
Je publierai toutes les leçons supplémentaires qui sont interrompues
La liste complète des leçons Sass avec des tests cassés:
https://learn.freecodecamp.org/front-end-libraries/sass/store-data-with-sass-variables
https://learn.freecodecamp.org/front-end-libraries/sass/use-for-to-create-a-sass-loop
https://learn.freecodecamp.org/front-end-libraries/sass/use-each-to-map-over-items-in-a-list
https://learn.freecodecamp.org/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with- while
Voici une aide visuelle:
J'ai également confirmé la réussite des tests intermittents (en envoyant du spam "Exécuter les tests") sur:
https://learn.freecodecamp.org/front-end-libraries/sass/store-data-with-sass-variables
https://learn.freecodecamp.org/front-end-libraries/sass/use-each-to-map-over-items-in-a-list
mais pas sur les 2 autres leçons de Sass cassées (celles-ci échouent toujours):
https://learn.freecodecamp.org/front-end-libraries/sass/use-for-to-create-a-sass-loop
https://learn.freecodecamp.org/front-end-libraries/sass/apply-a-style-until-a-condition-is-met-with- while
J'ai eu du mal au début avec les mêmes problèmes, mais jusqu'à présent, je dois tout passer (en haut et en incluant l'exemple @ while - pas encore essayé les autres) - le problème semble être un espace blanc
Pour certains, par exemple, l'exemple @ while a même nécessité de supprimer toute indentation du bit SASS
Essayez de supprimer toutes les lignes vides entre le code et - si cela ne résout pas le problème - de ne pas indenter du tout le code SASS.
[en utilisant FCC avec Safari 11.0.2]
@MikeForde Cela a fonctionné pour moi lorsque je suis passé à Safari pour passer ce module. Cependant, je ne pouvais toujours pas le faire fonctionner de quelque manière que ce soit lors de son exécution dans Chrome 67.
Je n'ai pas pu les faire fonctionner dans Safari ou Chrome 67
Suppression de tous les retraits et espacements dans le
Non d'accord, il y a plus que l'espace blanc. Ce que j'ai remarqué, c'est que - avec l'exemple @ while - si je continue d'appuyer sur le bouton "Exécuter les tests", alors - s'il n'y a pas d'erreurs réelles - après 4-5 pressions, cela fonctionne, alors que s'il y a une véritable ne passe jamais. Pas exactement un comportement idéal, mais suggérerait une erreur de bas niveau plutôt qu'une erreur liée à une erreur syntaxique réelle dans le code soumis par l'utilisateur.
Salut à tous, quels que soient les problèmes, ils semblent être résolus. J'ai réussi le défi pour la première fois et j'utilise la version 67.0.3396.87 de Chrome (version officielle) (64 bits)
Non, cela m'arrive encore quand j'essaye les tests. Semble n'affecter que certains utilisateurs.
Ran dans le même problème - FireFox 56.0.2.
Effacé tous les espaces blancs; indentation, etc. vérifié.
Les deux derniers tests ont toujours échoué. Tentative de "spam" le bouton Exécuter le test .. jusqu'à présent, pas de chance.
=====
edit: je l'ai finalement fait fonctionner. Je ne me souviens pas si cela était dû à une erreur mineure de ma part ou simplement en appuyant patiemment sur le bouton "Exécuter les tests" à plusieurs reprises. J'ai fini par faire la méthode "écraser le bouton Exécuter les tests" sur plusieurs leçons SASS après celle-ci.
voici astuce pour Sass: Utilisez @for pour créer une boucle Sass:
il n'y a pas de seconde chance car il y a certainement un bug dans ce défi.
@for $j from 1 through 5 {
.text-#{$j} { font-size: 10px* $j; }
}
Hello
Hello
Hello
Hello
Hello
Vous pouvez ajouter votre style de couleur à la balise div. Cela fonctionne pour moi.
<div class="blog-post" style="color: red;">
@ mahmoud-coo6 Votre méthode fonctionne-t-elle sur Appliquer un style jusqu'à ce qu'une condition soit remplie avec @ while ?
J'ai un avertissement ici: Your .text-1 class should have a font-size of 5px.
Je suis presque sûr que la taille de la police est de 5px.
Je corrige Appliquer un style jusqu'à ce qu'une condition soit remplie @ while? Défiez en utilisant Firefox au lieu de google-chrome, cela a fonctionné pour moi.
J'avais ajouté un style d'arrière-plan aux balises div ..... pour que ces défis sass buggés passent leur test .... !!
<div class="blue-bg" style="background-color: blue"></div>
<div class="black-bg" style="background-color: black"></div>
<div class="red-bg" style="background-color: red"></div>
voici la solution @flyfishingbarbara : il y a un certain temps sans travail car il y a un bug sur le site
@each $color in blue,black, red {
.#{$color}-bg { background-color: $color;}
}
div {
height: 200px;
width: 200px;
}
le numéro est de retour avec @for
et @each
.
Cela ne fonctionnerait pas sur Chrome 68.0.3440.106 et pas sur Opera 55.0, mais cela fonctionnait parfaitement sur Firefox 59.0.2 (tous 64 bits). Les trois derniers exercices nécessitaient cependant un peu de spaming sur le bouton "Exécuter le test"
@raisedadead @ValeraS
Est-ce que cela résout ce problème?
https://github.com/freeCodeCamp/freeCodeCamp/pull/27716
@paulywill Ce n'est pas lié à ce problème, et le problème a déjà été résolu dans la branche principale.
lol, j'ai rencontré le même problème ...
@ZTYZZ Rencontrez -vous le même problème sur le site bêta ?
Sur Firefox Developer Edition (72.0b2 (64 bits)) cela ne fonctionne pas.
@nmichalakis Quelles erreurs voyez-vous dans la console du navigateur?
@RandellDawson j'ai trouvé le "bug" s'il y a un espace entre le nom de la variable et le ":" il ne se compile pas correctement. Est-ce quelque chose qui se produit également sur les fichiers .scss simples?
Donc par exemple si je cours
$ nom-var: couleur; (un espace avant et après ":") il ne se compile pas mais si je lance le même
$ var-name: color (pas d'espace juste après la déclaration $ var, ça marche!)
Veuillez ouvrir un nouveau numéro avec ces détails. Merci.
@chaque $ couleur en bleu, noir, rouge {
. # {$ color} -bg {background-color: $ color;}
}
Commentaire le plus utile
Vous pouvez ajouter votre style de couleur à la balise div. Cela fonctionne pour moi.